7::-webkit-scrollbar //滾動條整體部分，其中的屬性有width,height,background,border（就和乙個塊級元素一樣）等。（位置1）
::-webkit-scrollbar-button //滾動條兩端的按鈕。可以用display:none讓其不顯示，也可以新增背景，顏色改變顯示效果。（位置2）
::-webkit-scrollbar-track // 外層軌道。可以用display:none讓其不顯示，也可以新增背景，顏色改變顯示效果（位置3）
::-webkit-scrollbar-track-piece //內層軌道，滾動條中間部分（位置4）
::-webkit-scrollbar-thumb //滾動條裡面可以拖動的那部分（位置5）
::-webkit-scrollbar-corner //邊角（位置6）
::-webkit-resizer //定義右下角拖動塊的樣式（位置7）
注意：對以上各個部分定義width,height時。有如下功能：若是水平滾動條，則width屬性不起作用，height屬性用來控制滾動條相應部分豎直方向高度；若是豎直滾動條，則height屬性不起作用，width屬性用來控制相應部分的寬度。
在chrome中，滾動條中的各個部分和dom中塊級元素是一樣的。通過::-webkit-scrollbar等就類似於原來所說的css中的選擇器。而{}中的屬性，你就像控制一般塊級元素一樣簡單（強大啊）。
0102
0304
0506
0708
0910
1112
1314
1516
1718
1920
2122
2324
2526
2728
2930
3132
#scroll-1
#scroll-1div
#scroll-1::-webkit-scrollbar
#scroll-1::-webkit-scrollbar-button
#scroll-1::-webkit-scrollbar-track
#scroll-1::-webkit-scrollbar-track-piece
#scroll-1::-webkit-scrollbar-thumb
#scroll-1::-webkit-scrollbar-corner
#scroll-1::-webkit-scrollbar-resizer
0102
0304
0506
0708
0910
1112
<divid="scroll-1">
<div>
web前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(
web前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(
web前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(
web前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(
web前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(前端開發-web前端工程師--web前端學習之路(
滾動條樣式
支援情況
支援瀏覽器版本
可否繼承
描述scrollbar-3dlight-color
ie特有屬性
ie5.5+
y設定滾動框的和滾動條箭頭左上邊緣的顏色
scrollbar-highlight-color
ie特有屬性
ie5.5+
y設定滾動框的和滾動條箭頭左上邊緣的顏色
scrollbar-face-color
ie特有屬性
ie5.5+
y設定滾動框和滾動條箭頭的顏色
scrollbar-arrow-color
ie特有屬性
ie5.5+
y設定滾動條箭頭的顏色
scrollbar-shadow-color
ie特有屬性
ie5.5+
y設定滾動框的和滾動條箭頭右下邊緣的顏色
scrollbar-dark-shadow-color
ie特有屬性
ie5.5+
y設定滾動條槽的顏色
scrollbar-base-color
ie特有屬性
ie5.5+
y設定滾動條主要構成部分的顏色
scrollbar-track-color
ie特有屬性
ie5.5+
y設定滾動條軌跡組成部分的顏色
ad：【chrome***外掛程式】w3cways qr code generator
自定義瀏覽器滾動條樣式
webkit scrollbar 滾動條垂直方向的寬度與水平方向的高度 webkit scrollbar button 滾動條按鈕 webkit scrollbar track 滾動條軌道 webkit scrollbar track piece 滾動條垂直方向軌道件 webkit scrollba...
隱藏瀏覽器預設滾動條和自定義滾動條樣式
chrome瀏覽器和移動端可以使用 webkit scrollbar隱藏瀏覽器自帶的滾動條 webkit scrollbar而火狐和ie可以通過給溢位的盒子巢狀乙個父盒子，設定溢位部分auto顯示，然後使其寬度增加17px 瀏覽器預設佔據內容的寬度為17px 然後給包裹內容的父盒子在設定overfl...
瀏覽器滾動條 自定義「衣裳」
我在電腦上開啟了一些瀏覽器，先觀察一下，其中ie瀏覽器版本 10 5 在我電腦上顯示是一致的，火狐版本為 59.0.2。如下圖 1 可見，除了火狐瀏覽器和opera瀏覽器的樣式與其他瀏覽器樣式差別較大，其餘樣式差別不大，主要是顏色的不同。不知道為什麼我放不上，唉 一 專屬ie的 衣裳 網上找到乙個不...