CSS設置滾動條樣式

1.webkit瀏覽器 滾動條的屬性

1. ::-webkit-scrollbar 滾動條整體部分，其中的屬性: width,height,background,border等。
2. ::-webkit-scrollbar-button 滾動條兩端的按鈕，可以用display:none讓其不顯示，也可以添加背景圖片，顏色改變顯示效果。
3. ::-webkit-scrollbar-track 外層軌道。可以用display:none讓其不顯示，也可以添加背景圖片，顏色改變顯示效果。
4. ::-webkit-scrollbar-track-piece 內層滾動槽/軌道，需要注意的就是它會覆蓋第三個屬性的樣式。
5. ::-webkit-scrollbar-thumb 滾動的滑塊
6. ::-webkit-scrollbar-corner 邊角，兩個滾動條交匯處
7. ::-webkit-resizer 定義右下角拖動塊的樣式/兩個滾動條交匯處用於拖動調整元素大小的小控件（基本用不上）

2.自定義滾動條效果

::-webkit-scrollbar{
            width:14px;
            background-color: #0e487c;
          }
          ::-webkit-scrollbar-thumb{
            background-color: #4facfa;
          }

　　

3.IE8設置滾動條

scrollbar-arrow-color: color; /*三角箭頭的顏色*/
scrollbar-face-color: color; /*立體滾動條的顏色（包括箭頭部分的背景色）*/
scrollbar-3dlight-color: color; /*立體滾動條亮邊的顏色*/
scrollbar-highlight-color: color; /*滾動條的高亮顏色（左陰影？）*/
scrollbar-shadow-color: color; /*立體滾動條陰影的顏色*/
scrollbar-darkshadow-color: color; /*立體滾動條外陰影的顏色*/
scrollbar-track-color: color; /*立體滾動條背景顏色*/
scrollbar-base-color:color; /*滾動條的基色*/