修改瀏覽器滾動條樣式

滾動條樣式修改,沒有找到修改火狐瀏覽器滾動條的代碼css

把如下樣式加入css,圖片爲谷歌、safari、qq瀏覽器、360瀏覽器滾動條樣式和ie滾動條樣式及ie原始默認樣式html

/*谷歌、safari、qq瀏覽器、360瀏覽器滾動條樣式*/
/*定義滾動條高寬及背景 高寬分別對應橫豎滾動條的尺寸*/  
::-webkit-scrollbar  
{  
    width: 10px;  
    height: 10px;  
    background-color: #F5F5F5;  
}  
/*定義滾動條軌道 內陰影+圓角*/  
::-webkit-scrollbar-track  
{  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  
    border-radius: 10px;  
    background-color: #F5F5F5;  
}    
/*定義滑塊 內陰影+圓角*/  
::-webkit-scrollbar-thumb  
{  
    border-radius: 10px;  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);  
    background-color: #bdbdbd;  
}  
/*滑塊效果*/
::-webkit-scrollbar-thumb:hover
{
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: rgba(0,0,0,0.4);
}
/*IE滾動條顏色*/
html {
    scrollbar-face-color:#bfbfbf;/*滾動條顏色*/
    scrollbar-highlight-color:#000;
    scrollbar-3dlight-color:#000;
    scrollbar-darkshadow-color:#000;
    scrollbar-Shadow-color:#adadad;/*滑塊邊色*/
    scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭頭顏色*/
    scrollbar-track-color:#eeeeee;/*背景顏色*/
}web

相關文章
相關標籤/搜索