CSS如何設(shè)置滾動條顏色 想要讓網(wǎng)頁變得更加美觀，其中一個(gè)方法就是設(shè)置滾動條的顏色。下面就來介紹一下如何使用CSS來設(shè)置滾動條顏色。 首先，我們需要在CSS中使用::-webkit-scrollbar來定位滾動條。我們可以使用 background-color 和 border-radius 分別修改滾動條的背景顏色和圓角程度，如下所示：

::-webkit-scrollbar {
background-color: #F1F1F1;
border-radius: 10px;
}

接著，我們要在CSS中指定滾動條上下文里的thumb（拖拽條）和track（包含thumb的軌跡）的顏色。我們可以使用background 和 border-radius 分別為thumb和track設(shè)置背景顏色和圓角程度，如下所示：

::-webkit-scrollbar-thumb {
background-color: #777;
border-radius: 10px;
}
::-webkit-scrollbar-track {
background-color: #F1F1F1;
border-radius: 10px;
}

最后，我們要在上述代碼后面添加以下代碼來修改滾動條的滑塊尺寸：

::-webkit-scrollbar-thumb {
height: 50px;
}

如果想要在其他瀏覽器中也能夠設(shè)置滾動條顏色，可以加上類似于下面的代碼：

*::-webkit-scrollbar {
background-color: #F1F1F1;
border-radius: 10px;
}
*::-webkit-scrollbar-thumb {
background-color: #777;
border-radius: 10px;
}
*::-webkit-scrollbar-track {
background-color: #F1F1F1;
border-radius: 10px;
}
*::-webkit-scrollbar-thumb:horizontal {
height: 50px;
}
*::-webkit-scrollbar-thumb:vertical {
width: 50px;
}

以上就是使用CSS來設(shè)置滾動條顏色的方法，希望對大家有所幫助！