跟大家講解下有關html滾動條樣式如何設置，相信小伙伴們對這個話題應該也很關注吧，現在就為小伙伴們說說html滾動條樣式如何設置，小編也收集到了有關html滾動條樣式如何設置的相關資料，希望大家看到了會喜歡。

設置html滾動條樣式的方法：首先新建文檔，再新建CSS文件；然后創建DIV標簽并填充內容，并設定滾動條內框的大小，代碼為【overflow-y: scroll;overflow-x: scroll;】。

本教程操作環境：windows7系統、html5&&css3版，DELL G3電腦。

設置html滾動條樣式的方法：

1、新建一個HTML文檔，這里設立一下基本的架構。

2、再新建一個CSS文件，用link關聯一下HTML文檔。

3、創建DIV標簽，并且往里面填充內容。

4、先設定一下滾動條內框的大小，用border先來查看是否有超出，這里可以看出超出了很多內容。

5、

overflow-y: scroll;

overflow-x: scroll;

加上這個樣式滾動條就會出現了。

6、

#ds::-webkit-scrollbar-track { background-color: green;} #ds::-webkit-scrollbar { width: 20px;} #ds::-webkit-scrollbar-thumb { background-color: pink; border-radius: 50%;}

現在我們就能對軌道和滾動條進行樣式的設置了。

相關學習推薦：html教程

以上就是html滾動條樣式如何設置的詳細內容，更多請關注php中文網其它相關文章！

來源：php中文網