/*定義滾動條高寬及背景 高寬分別對應橫豎滾動條的尺寸*/
::-webkit-scrollbar
/*定義滾動條軌道 內陰影+圓角*/
::-webkit-scrollbar-track
/*定義滑塊 內陰影+圓角*/
::-webkit-scrollbar-thumb
偽類大家應該很熟悉:link,:focus,:hover，此外css3中又增加了許多偽類選擇器，如:nth-child，:last-child，:nth-last-of-type()等。
css中的偽元素大家以前看過：:first-line,:first-letter,:before,:after。那麼在css3中，偽元素進行了調整，在以前的基礎上增加了乙個「：」也就是現在變成了「::first-letter,::first-line,::before,::after」，另外css3還增加了乙個「::selection」。兩個「：：」和乙個「：」在css3中主要用來區分偽類和偽元素。
webkit的偽類和偽元素的實現很強，可以把滾動條當成乙個頁面元素來定義，再結合一些高階的css3屬性，比如漸變、圓角、rgba等等。然後如果有些地方要用，可以把也可以轉換成base64，不然每次都得載入那個多個，增加請求數。
任何物件都可以設定：邊框、陰影、背景等等，建立的滾動條任然會按照作業系統本身的設定來完成其互動的行為。下面的偽類可以應用到上面的偽元素中。有點小複雜，具體怎麼寫可以看第乙個demo，那裡也有注釋。
:horizontal
//horizontal偽類適用於任何水平方向上的滾動條
:vertical
//vertical偽類適用於任何垂直方向的滾動條
:decrement
//decrement偽類適用於按鈕和軌道碎片。表示遞減的按鈕或軌道碎片，例如可以使區域向上或者向右移動的區域和按鈕
:increment
//increment偽類適用於按鈕和軌道碎片。表示遞增的按鈕或軌道碎片，例如可以使區域向下或者向左移動的區域和按鈕
:start
//start偽類適用於按鈕和軌道碎片。表示物件（按鈕 軌道碎片）是否放在滑塊的前面
:end
//end偽類適用於按鈕和軌道碎片。表示物件（按鈕 軌道碎片）是否放在滑塊的後面
:double-button
//double-button偽類適用於按鈕和軌道碎片。判斷軌道結束的位置是否是一對按鈕。也就是軌道碎片緊挨著一對在一起的按鈕。
:single-button
//single-button偽類適用於按鈕和軌道碎片。判斷軌道結束的位置是否是乙個按鈕。也就是軌道碎片緊挨著乙個單獨的按鈕。
:no-button
no-button偽類表示軌道結束的位置沒有按鈕。
:corner-present
//corner-present偽類表示滾動條的角落是否存在。
:window-inactive
//適用於所有滾動條，表示包含滾動條的區域，焦點不在該視窗的時候。
::-webkit-scrollbar-track-piece:start
::-webkit-scrollbar-thumb:window-inactive
::-webkit-scrollbar-button:horizontal:decrement:hover
CSS 設定滾動條樣式
從dhtml出現以來，微軟對dhtml功能的加強就沒有停止過，在微軟最新的遊覽器internet explorer 5.5的的ie5.5增加了許多新的樣式表內容，對滾動條的樣式進行修改也是其中之一，下面我們簡單地介紹一下涉及瀏覽器滾動條的樣式表內容 1 overflow內容溢位時的設定 overfl...
CSS滾動條樣式設定
css滾動條樣式設定 webkit瀏覽器css設定滾動條 主要有下面7個屬性 webkit scrollbar 滾動條整體部分，可以設定寬度啥的 webkit scrollbar button 滾動條兩端的按鈕 webkit scrollbar track 外層軌道 webkit scrollbar...
設定滾動條樣式
html scrollbar 3d light color立體滾動條亮邊的顏色 scrollbar arrow color上下按鈕上三角箭頭的顏色 scrollbar base color滾動條的基本顏色 scrollbar dark shadow color立體滾動條強陰影的顏色 scrollba...