css3滾動條樣式

滾動條組成

• ::-webkit-scrollbar 滾動條整體部分
• ::-webkit-scrollbar-thumb 滾動條裏面的小方塊，能向上向下移動（或往左往右移動，取決於是垂直滾動條還是水平滾動條）
• ::-webkit-scrollbar-track 滾動條的軌道（裏面裝有Thumb）
• ::-webkit-scrollbar-button 滾動條的軌道的兩端按鈕，允許通過點擊微調小方塊的位置。
• ::-webkit-scrollbar-track-piece 內層軌道，滾動條中間部分（除去）
• ::-webkit-scrollbar-corner 邊角，即兩個滾動條的交匯處
• ::-webkit-resizer 兩個滾動條的交匯處上用於通過拖動調整元素大小的小控件

移動端隱藏scroll滾動條 :-webkit-scrollbar

::-webkit-scrollbar {/*隱藏滾輪*/
    display: none;
}

應用

::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}
::-webkit-scrollbar-button {
	display: none;
}
::-webkit-scrollbar-track {
	background: #e8e8e8;
	border-radius: 8px;
}
::-webkit-scrollbar-thumb {
	background: #bbb;
	border-radius: 8px;
}
::-webkit-scrollbar-corner {
	background: #e8e8e8;
	border-radius: 8px;
}
::-webkit-scrollbar-resizer {
	background: #e8e8e8;
	border-radius: 8px;
}