用css代码写一个倒三角

可以使用CSS的伪元素:before或:after来实现一个倒三角形状。

例如，使用:before来创建一个黑色倒三角形：

.triangle {
  position: relative;
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-top: 50px solid black;
}

.triangle:before {
  content: "";
  position: absolute;
  top: -50px;
  left: -50px;
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-bottom: 50px solid black;
}

解释：

1. .triangle类是三角形的外部容器，它需要使用相对定位（position: relative）来使伪元素使用绝对定位（position: absolute）相对于它定位。

2. 三角形的宽度和高度都必须设置为0，因为我们只想使用边框来构建形状。

3. 使用border属性来定义三角形的形状。在这个例子中，我们使用border-top来定义黑色三角形的顶部，使用border-left和border-right来定义两侧的斜边。

4. 使用伪元素:before来创建一个与外部容器相同大小的三角形，但是边框的位置是相反的，因此它绘制了一个倒三角形。

5. 通过设置伪元素的top和left属性来定位三角形的位置。

6. 使用border-bottom属性来定义倒三角形的底部。

通过调整上述代码中的边框宽度和颜色，可以创建不同大小和颜色的倒三角形。