本文摘自PHP中文網(wǎng)，作者清淺，侵刪。
CSS3中自定義滾動(dòng)條樣式的方法：首先創(chuàng)建一個(gè)HTML示例文件；然后通過給元素設(shè)置“：”來生成滾動(dòng)條；最后通過設(shè)置屬性的各個(gè)值重新自定義滾動(dòng)條的樣式即可。
本文操作環(huán)境：系統(tǒng)、HTML5&&CSS3版、Dell G3電腦。
CSS3中可以通過給元素設(shè)置：生成滾動(dòng)條，再通過設(shè)置屬性中的各個(gè)值重新自定義滾動(dòng)條的樣式
在瀏覽器中滾動(dòng)條是必不可少的css 中設(shè)置滾動(dòng)條顏色，通常具有獨(dú)特的滾動(dòng)條的網(wǎng)站更加吸引人注目，也使網(wǎng)站看起來與眾不同。自定義滾動(dòng)條我們可以使用插件來實(shí)現(xiàn)同樣也可以利用CSS3來創(chuàng)建屬于自己的滾動(dòng)條css 中設(shè)置滾動(dòng)條顏色，接下來在文章中將為大家詳細(xì)介紹如何使用CSS3創(chuàng)建自定義滾動(dòng)條
屬性：
主要是設(shè)置內(nèi)容溢出時(shí)的樣式（超出是否顯示滾動(dòng)條）
-x：水平方向內(nèi)容溢出時(shí)的設(shè)置
-y：垂直方向內(nèi)容溢出時(shí)的設(shè)置
三個(gè)屬性設(shè)置的值有：(默認(rèn)值)、、、auto。
默認(rèn)滾動(dòng)條樣式：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
. {
-color: #;
: 300px;
width: 65px;
: 100px auto;
-y: ;//設(shè)置滾動(dòng)條
}
. {
: 450px;
}
【推薦課程：CSS3教程】
效果圖：
屬性：
-face-color：立體滾動(dòng)條凸出部分的顏色
-arrow-color上下按鈕上三角箭頭的顏色
--color：滾動(dòng)條空白部分的顏色
--color：立體滾動(dòng)條邊框的顏色
注意：這些屬性僅支持在IE瀏覽器下
例：
1
-face-color:pink;
效果圖：
自定義滾動(dòng)條樣式：
--：滾動(dòng)條整體部分
--- ：滾動(dòng)條兩端的按鈕
---track ：外層軌道
---track-piece ：內(nèi)層軌道，滾動(dòng)條中間部分（除去）
---thumb： 拖動(dòng)條
---： 邊角
-- ：定義右下角拖動(dòng)塊的樣式