CSS小箭頭怎么寫(xiě)？

在CSS中，我們可以使用偽元素::before或::after來(lái)創(chuàng)建小箭頭，以下是一個(gè)基本的示例：

.arrow {
  position: relative;
}
.arrow::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 10px solid #000;
}

在這個(gè)示例中，我們創(chuàng)建了一個(gè)類(lèi)為arrow的元素，并使用偽元素::after來(lái)創(chuàng)建一個(gè)小箭頭，通過(guò)調(diào)整border-left的寬度和顏色，我們可以改變箭頭的大小和顏色，使用position: absolute;將偽元素定位在元素的左上角。

除了使用偽元素外，我們還可以使用SVG來(lái)創(chuàng)建小箭頭，以下是一個(gè)使用SVG的示例：

<svg class="arrow" viewBox="0 0 10 10">
  <path d="M0,5 L10,5 L5,0 Z" fill="#000"/>
</svg>

在這個(gè)示例中，我們創(chuàng)建了一個(gè)類(lèi)為arrow的SVG元素，并使用<path>元素來(lái)繪制一個(gè)小箭頭，通過(guò)調(diào)整<path>元素的d屬性，我們可以改變箭頭的形狀和大小，使用fill屬性來(lái)設(shè)置箭頭的顏色。

無(wú)論是使用偽元素還是SVG，我們都可以輕松地創(chuàng)建出小箭頭，選擇哪種方法取決于你的具體需求和設(shè)計(jì)。