【實習所遇問題-03】修改默認滾動條樣式(0px)

css樣式

/修改滾動條樣式/

---

div::-webkit-scrollbar{
width:10px;
height:10px;

}
div::-webkit-scrollbar-track{
background: rgb(239, 239, 239);
border-radius:2px;
}
div::-webkit-scrollbar-thumb{
background: #bfbfbf;
border-radius:10px;
}
div::-webkit-scrollbar-thumb:hover{
background: #333;
}
div::-webkit-scrollbar-corner{
background: #179a16;
}

---

參數說明：

::-webkit-scrollbar 滾動條整體部分

::-webkit-scrollbar-thumb 滾動條裏面的小方塊，能向上向下移動（或往左往右移動，取決於是垂直滾動條還是水平滾動條）

::-webkit-scrollbar-track 滾動條的軌道（裏面裝有Thumb）

::-webkit-scrollbar-button 滾動條的軌道的兩端按鈕，允許通過點擊微調小方塊的位置。

::-webkit-scrollbar-track-piece 內層軌道，滾動條中間部分（除去）

::-webkit-scrollbar-corner 邊角，即兩個滾動條的交匯處

::-webkit-resizer 兩個滾動條的交匯處上用於通過拖動調整元素大小的小控件

---

轉載自博客園流水無痕Sherry