第一种方法：

.triangle {width: 0;height: 0;border-left: 50px solid transparent;border-right: 50px solid transparent;border-bottom: 100px solid blue; /* 三角形的颜色 */
}

.triangle 类定义了一个零宽高的块级元素，并通过设置边框的样式来创建三角形的形状。通过调整 border-left、border-right 和 border-bottom 的宽度和颜色，你可以自定义三角形的大小和外观。

第二种方法：

.triangle {width: 100px;height: 100px;background-color: blue; /* 三角形的颜色 */clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}

.triangle 类定义了一个正方形元素，并使用 clip-path 属性将其剪裁为三角形。polygon() 函数允许你指定多边形的顶点坐标，这里我们指定了三个顶点来创建一个三角形。