前面的話：對只有一種瀏覽器支持的屬性，就不要出來秀咱前端同學(xué)从藤，就像是早些年手機(jī)們的充電口一樣比规，集各家所長，咱今天說的是webkit的滾動條樣式讥邻，視乎只有webkit支持此項定義迫靖，有見識的前輩來辯。這玩意兒也就可以玩玩兴使，漲漲見識系宜，跑跑PC版的谷歌，UC...親測发魄，在移動端完全不支持
這是一個簡短的小短文：
** 屬性寫哪盹牧，用的是偽類俩垃，直接寫在css文件中，帶上::雙引號**
------------
主要有以下屬性汰寓，一眼望到頭
::-webkit-scrollbar-track { background-color: #b46868; /*定義外層軌道*/ }
::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.2); /*定義滑塊*/ }
/*::-webkit-scrollbar-button { background-color: #7c2929; /*定義兩端按鈕口柳，已經(jīng)定義沒有按鈕啦*/ }*/
::-webkit-scrollbar-corner {background-color: black; /*可不定義，但必須加上*/ }
::-webkit-scrollbar{width:1em; height:100%;} /*整體設(shè)置寬高*/
::-webkit-scrollbar-track-piece{background-color:transparent;} /*內(nèi)層軌道設(shè)置顏色值*/
body::-webkit-scrollbar-track-piece{background-color:#ccc;} /*在body中的內(nèi)層軌道置一個顏色*/
::-webkit-scrollbar-track-piece:no-button{} /*沒有兩端的按鈕*/
::-webkit-scrollbar-thumb{background-color:#29944d;border-radius: 2px;} /*滑塊的樣式有滑，顏色值跃闹，和圓角*/
::-webkit-scrollbar-thumb:hover{background-color:red;} /*鼠標(biāo)經(jīng)過滑塊的反饋*/
::-webkit-scrollbar-thumb:active{background-color:#0eaf52;} /*鼠標(biāo)在滑塊之上的顏色值*/26 body{height: 2000px;}
直接上效果：
871918-20160329204355691-1574893148.jpg
871918-20160329204453941-867653776.jpg
871918-20160329204508441-1809627313.jpg
PC端： 不支持的有,IE（廢話嘛），火狐
移動端： 完全不支持
后語：
這屬性在我的眼中沒啥的使用價值毛好，也許是眼光還不夠望艺，說不定以后還玩出新花樣呢
最近發(fā)現(xiàn)移動端的UC居然不支持flex，UC你是想上天嗎肌访，果斷發(fā)建議找默，得到的回答是“兩天后給您答復(fù)哦”，我等著呢场靴。在測試中啡莉，除了操蛋的手機(jī)版UC不支持好用的flex外，其他手機(jī)瀏覽器（包括國產(chǎn)的qq瀏覽器旨剥，360咧欣，百度等，包括國際品牌谷歌轨帜，火狐等）無一例外魄咕，支持。
