简述 CSS利⽤伪元素绘制三⻆形？

参考答案：

CSS 伪元素是一种特殊类型的元素，它们并不直接存在于 HTML 中，但是可以通过 CSS 创建并控制。其中，::before 和 ::after 是最常用的两个伪元素。我们可以使用它们来绘制三角形。

一个基本的三角形可以通过一个容器和它的 ::before 或 ::after 伪元素来绘制。这个容器通常是一个空的 div，而三角形则通过为伪元素设置 border 来创建。

下面是一个例子，展示了如何使用 CSS 伪元素来绘制一个向上的三角形：

<div class="triangle"></div>

.triangle {
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-bottom: 100px solid red;
}

在这个例子中，.triangle 的 border-left 和 border-right 是透明的，而 border-bottom 是红色的。由于左右边框是透明的，它们实际上不会显示，而底部边框则形成了一个向上的三角形。

同样的方法可以用来绘制向左、向右和向下的三角形，只需要改变 border 的设置即可。例如，要绘制一个向左的三角形，可以将 border-bottom 设置为透明，而将 border-left 设置为实色。

需要注意的是，这种方法创建的三角形实际上是一个边框，因此它的颜色、宽度和样式都可以通过 border 相关的 CSS 属性来控制。同时，由于它是通过边框来创建的，因此它的高度和宽度实际上是由边框的宽度来决定的，而不是由容器的尺寸来决定的。