首先我們來(lái)看一下css設(shè)置滾動(dòng)條可能需要的屬性。

1、overflow-y : 設(shè)置當(dāng)對(duì)象的內(nèi)容超過(guò)其指定高度時(shí)如何管理內(nèi)容；overflow-x : 設(shè)置當(dāng)對(duì)象的內(nèi)容超過(guò)其指定寬度時(shí)如何管理內(nèi)容

參數(shù):

visible：擴(kuò)大面積以顯示所有內(nèi)容
auto：僅當(dāng)內(nèi)容超出限定值時(shí)添加滾動(dòng)條
hidden：總是隱藏滾動(dòng)條
scroll：總是顯示滾動(dòng)條

2、height : 設(shè)置滾動(dòng)條的高度（修改其后數(shù)值即可）。

3、滾動(dòng)條顏色參數(shù)設(shè)置：

scrollbar-3d-light-color 設(shè)置或檢索滾動(dòng)條亮邊框顏色
scrollbar-highlight-color 設(shè)置或檢索滾動(dòng)條3D界面的亮邊（ThreedHighlight）顏色
scrollbar-face-color 設(shè)置或檢索滾動(dòng)條3D表面（ThreedFace）的顏色
scrollbar-arrow-color 設(shè)置或檢索滾動(dòng)條方向箭頭的顏色
scrollbar-shadow-color 設(shè)置或檢索滾動(dòng)條3D界面的暗邊（ThreedShadow）顏色
scrollbar-dark-shadow-color 設(shè)置或檢索滾動(dòng)條暗邊框（ThreedDarkShadow）顏色
scrollbar-base-color 設(shè)置或檢索滾動(dòng)條基準(zhǔn)顏色

其次我們來(lái)看css設(shè)置滾動(dòng)條樣式。

在html頁(yè)面中我們可以這樣定義整個(gè)頁(yè)面的滾動(dòng)條。

*{
scrollbar-3dlight-color:#D4D0C8; 
   scrollbar-highlight-color:#fff; 
   scrollbar-face-color:#E4E4E4; 
   scrollbar-arrow-color:#666; 
   scrollbar-shadow-color:#808080; 
   scrollbar-darkshadow-color:#D7DCE0; 
   scrollbar-base-color:#D7DCE0; 
   scrollbar-track-color:#;
}

最后我們來(lái)看一看css 設(shè)置滾動(dòng)條后如何隱藏（橫向、豎向）

很多人都說(shuō)使用overflow-y:hiddencss可以隱藏滾動(dòng)條，但是只能針對(duì)div元素，并不能隱藏瀏覽器，而一些資料說(shuō) <boby>里加入scroll="no"，可隱藏滾動(dòng)條；在<boby>里加入style="overflow-x:hidden"，可隱藏水平滾動(dòng)條；加入style="overflow-y:hidden"，可隱藏垂直滾動(dòng)條。

1、完全隱藏：在里加入scroll="no"，可隱藏滾動(dòng)條;

2、在不需要時(shí)隱藏：指當(dāng)瀏覽器窗口寬度或高度大于頁(yè)面的寬或高時(shí)，不顯示滾動(dòng)條;反之，則顯示;

3、樣式表方法：

加入style="overflow-x:hidden"，可隱藏水平滾動(dòng)條;

加入style="overflow-y:hidden"，可隱藏垂直滾動(dòng)條。

最終隱藏方法：

在頁(yè)面添加

<style>html {
 overflow-x:hidden; //隱藏水平滾動(dòng)條
 overflow-y:hidden;//隱藏垂直滾動(dòng)條
 }
 </style>

相關(guān)推薦：

css固定div頭部不隨滾動(dòng)條滾動(dòng)

css層滾動(dòng)條_經(jīng)驗(yàn)交流

以上就是css如何設(shè)置滾動(dòng)條？實(shí)例詳解css滾動(dòng)條設(shè)置的方法的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！