解決chrome滾動條背景的問題

你們都知道chrome能夠自定義設置滾動條的樣式，能夠修改不少參數。
主要的兩行樣式的代碼以下：

::-webkit-scrollbar{} 
::-webkit-scrollbar-thumb{} /* 滾動條滑塊 */

當咱們給滾動條背景設置了樣式以後，頁面的滾動條即使設計了透明度，也仍是會有白色的底色

::-webkit-scrollbar{width:12px;background:transparent;}
::-webkit-scrollbar-thumb{background:#ccc;border-radius: 6px;}

如圖：

連接以下：http://jianxiujiucan.cn/test/...

這個白色的底色與背景會格格不入，怎麼樣才能把滾動條的顏色去掉呢？

你們知道有一個單位叫vw，就是網頁的可視區域寬度，它的寬度其實包括了滾動條的寬度。
而body默認的寬度沒有包含滾動條的寬度。
滾動條底下的白色其實並非滾動條的背景色，而是因爲body的寬度並未鋪滿可視區域的留白。
因此咱們只要在body上加一個width:100vw 便可解決這個問題，可是這種狀況下，會出現橫向的滾動條。
因此咱們須要把橫向的滾動條去掉。

連接以下：http://jianxiujiucan.cn/test/...

可是這樣寫在背景圖設置爲fixed的時候並不生效（具體緣由還在研究中）。