在網頁中，滾動條的樣式也是頁面設計中一個不可忽視的細節。因此，在 CSS 中也為我們提供了改變滾動條樣式的方法。 首先，在 CSS 中，我們可以使用如下的代碼來選擇要修改的滾動條的樣式：

::-webkit-scrollbar {
width: 10px;
background-color: #f5f5f5;
}

在這段代碼中，我們使用了偽元素 ::-webkit-scrollbar 來選擇 HTML 中所有的滾動條。接下來，我們可以使用 CSS 屬性來改變它們的樣式。在上面的例子中，我們設置了滾動條的寬度為 10 像素，并將其背景色設置為 #f5f5f5。 而下面這段代碼則是為了設置滾動條的滑塊的樣式：

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

這里，我們用 ::-webkit-scrollbar-thumb 選擇滑塊，然后設置了它的背景色和圓角半徑。 如果你想要改變滾動條的樣式而不止一種，那么可以再加入下面這段代碼：

::-webkit-scrollbar-track {
background-color: #f5f5f5;
}

這樣，我們就可以設置滾動條軌道的背景顏色了。 除了 ::-webkit-scrollbar，我們還可以使用其他的偽元素來改變不同瀏覽器中的滾動條樣式。例如，Firefox 中使用的是 ::-moz-scrollbar，而 IE 中使用的是 ::-ms-scrollbar。 在設計網頁時，改變滾動條樣式是一個小細節，但卻能讓整個頁面的視覺效果更為協調。使用 CSS 改變滾動條樣式，讓我們在頁面設計中更加自由和靈活。