css中怎么画三角形

在CSS中，我们可以使用border属性来绘制包括三角形在内的多边形。三角形是由3条边和3个角组成的，所以我们需要使用border定义三条边的样式。
为了方便起见，我们可以使用一个大小为0的div元素来绘制三角形。首先，我们设置div元素的宽高为0，然后通过border属性定义它的三条边。
以下是绘制一个向上的三角形的代码示例：

<br> <br>
    .triangle-up {<br>
      width: 0;<br>
      height: 0;<br>
      border-left: 20px solid transparent;<br>
      border-right: 20px solid transparent;<br>
      border-bottom: 20px solid red;<br>
    }<br> 

代码解释：
- width和height设置为0，表示我们只需要绘制三角形的边界。
- border-left和border-right用于绘制上部分的两条边，它们的宽度都为20px，且颜色为透明。
- border-bottom用于绘制下部分的一条边，它的宽度也为20px，颜色为红色。
可以看到，绘制一个三角形只需要通过border属性，设置不同的边框样式即可。
同样，我们可以绘制其它的三角形，例如向下、向左或向右的三角形。只需要在border属性中调整边框的宽度和颜色即可。

<br> <br>
    .triangle-down {<br>
      width: 0;<br>
      height: 0;<br>
      border-left: 20px solid transparent;<br>
      border-right: 20px solid transparent;<br>
      border-top: 20px solid green;<br>
    }<br>

    .triangle-left {<br>
      width: 0;<br>
      height: 0;<br>
      border-top: 20px solid transparent;<br>
      border-right: 20px solid pink;<br>
      border-bottom: 20px solid transparent;<br>
      border-left: 20px solid pink;<br>
    }<br>

    .triangle-right {<br>
      width: 0;<br>
      height: 0;<br>
      border-top: 20px solid transparent;<br>
      border-left: 20px solid blue;<br>
      border-bottom: 20px solid transparent;<br>
      border-right: 20px solid blue;<br>
    }<br> 

上述代码分别绘制了一个向下的绿色三角形、一个向左的粉色三角形以及一个向右的蓝色三角形。
总结：
在CSS中，我们可以使用border属性轻松绘制三角形及其它多边形。通过控制边框的颜色、宽度和样式，我们可以实现多种多样的图形效果。