在 CSS 中，經常需要使用小箭頭來表示多種狀態，比如向上的小箭頭表示某個元素可展開，已經展開的元素則需要將小箭頭指向下方來表示已經展開。接下來，我們就來介紹一下如何使用 CSS 代碼來繪制向上的小箭頭。

.up-arrow {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 6px solid #666;
}

上面的代碼定義了一個具有三角形形狀的元素。該元素的寬度和高度都為 0，其中左右邊框設為透明色，底邊框為灰色，這樣就形成了一個向上的小箭頭。

接下來，我們可以為箭頭元素設置不同的樣式來表示不同的狀態。比如，為了展示箭頭處于可展開狀態，我們可以通過旋轉箭頭來表示已經展開的狀態，代碼如下：

.up-arrow.expand {
transform: rotate(180deg);
}

通過使用 transform 屬性并旋轉箭頭，我們可以讓箭頭指向下方，從而表示箭頭所在的元素已經展開。

綜上所述，我們可以通過簡單的 CSS 代碼來繪制小箭頭并表現不同的狀態，這為我們的網頁設計帶來了更多的想象空間。