在 CSS 中，箭頭可以通過設置 border， border-width， transform 等屬性來實現不同的樣式。

.arrow {
width: 0;
height: 0;
border-style: solid;
border-width: 10px 0 10px 20px;
border-color: transparent transparent transparent #555;
}

這段代碼會生成一個向右的箭頭。我們可以通過調整 border-width 和 border-color 來改變箭頭的顏色和大小。

.arrow {
width: 0;
height: 0;
border-style: solid;
border-width: 10px 20px 10px 0;
border-color: transparent #555 transparent transparent;
}

這段代碼會生成一個向左的箭頭。

我們也可以使用 transform 屬性來改變箭頭的方向。

.arrow {
width: 20px;
height: 20px;
border-style: solid;
border-width: 10px 10px 0 0;
border-color: #555 transparent transparent transparent;
transform: rotate(45deg);
}

這段代碼會生成一個向右上方的箭頭。我們可以通過調整 transform:rotate() 中的角度來改變箭頭的方向。