CSS滾動條小箭頭是網頁設計中常用的小細節之一，它可以使滾動條更加美觀和易用。本文將介紹如何使用CSS樣式來定制滾動條箭頭。

/* 橫向滾動條 */
::-webkit-scrollbar {
height: 10px; /* 定義滾動條高度 */
}
/* 定義箭頭圖形 */
::-webkit-scrollbar-thumb {
background-color: #aaa; /* 滾動條顏色 */
border-radius: 5px; /* 圓角半徑 */
border: none; /* 去掉邊框 */
}
/* 定義箭頭樣式 */
::-webkit-scrollbar-button {
width: 10px; /* 定義箭頭寬度 */
height: 10px; /* 定義箭頭高度 */
}
/* 箭頭向右 */
::-webkit-scrollbar-button:horizontal:increment {
background-image: url(right-arrow.png); /* 圖片路徑 */
background-repeat: no-repeat; /* 防止圖片平鋪 */
}
/* 箭頭向左 */
::-webkit-scrollbar-button:horizontal:decrement {
background-image: url(left-arrow.png); /* 圖片路徑 */
background-repeat: no-repeat; /* 防止圖片平鋪 */
}

以上代碼中，::-webkit-scrollbar選擇器定義了整個滾動條的樣式，包括高度、顏色等。箭頭圖形的樣式在::-webkit-scrollbar-thumb中定義，其中background-color屬性控制箭頭顏色，border-radius屬性控制圓角半徑，border屬性去掉邊框。

定義箭頭樣式時，::-webkit-scrollbar-button選擇器用來控制箭頭的寬高，::-webkit-scrollbar-button:horizontal:increment和::-webkit-scrollbar-button:horizontal:decrement分別控制箭頭向右和向左。在這兩個選擇器中，background-image屬性用來定義箭頭圖像的路徑，background-repeat屬性防止圖片平鋪。

注意，-webkit-前綴是為了兼容WebKit瀏覽器內核（如Chrome、Safari），其他瀏覽器可以使用標準的scrollbar相關屬性進行定義。