HTML 網頁中的滾動條顏色設置是我們網頁美化的一個重要方面，設置好的滾動條可以讓網頁更加有美感，為了設置滾動條的顏色，需要我們在 CSS 中進行設置的。在 CSS 樣式文件中，我們可以定義滾動條的寬度、顏色、陰影、邊框等等特性，讓滾動條更加的美觀。

/*設置滾動條的寬度*/
::-webkit-scrollbar {
width: 10px;
}
/*定義滾動條的背景色*/
::-webkit-scrollbar-track {
background-color: #f1f1f1;
}
/*定義滾動條的顏色*/
::-webkit-scrollbar-thumb {
background-color: #888;
}
/*定義滾動條被懸停時的顏色*/
::-webkit-scrollbar-thumb:hover {
background-color: #555;
}

上面的代碼就是設置滾動條的樣式的示例，其中，width屬性定義了滾動條的寬度，background-color屬性定義了滾動條的背景色，::-webkit-scrollbar-thumb定義了滾動條的顏色，::-webkit-scrollbar-thumb:hover則是定義滾動條被懸停時的顏色。

值得注意的是，這些樣式只對沒有隱藏的滾動條有效，如果元素的overflow屬性設置為hidden，則不會顯示滾動條。

在進行滾動條樣式設置的時候要注意，這些樣式只對支持WebKit移動端和 PC 瀏覽器生效，實現瀏覽器兼容性的方法是使用 CSS3 的@supports屬性來識別。