如何设置滚动条的宽度及颜色？

Posted 2023-05-05

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何设置滚动条的宽度及颜色？相关的知识，希望对你有一定的参考价值。

参考技术A 设置滚动条颜色及样式的css
*::-webkit-scrollbar
width: 8px;
height: 8px;

*::-webkit-scrollbar-track
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;

*::-webkit-scrollbar-thumb
background-color: #e7e9e9;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;

如何修改网页中滚动条的颜色

<STYLE>
BODY
SCROLLBAR-FACE-COLOR: rgb(10,236,209); //滚动条凸出部分的颜色
SCROLLBAR-HIGHLIGHT-COLOR: rgb(23,255,155);//滚动条空白部分的颜色
SCROLLBAR-SHADOW-COLOR: rgb(255,116,23);//立体滚动条阴影的颜色
SCROLLBAR-3DLIGHT-COLOR: rgb(66,93,127);//滚动条亮边的颜色
SCROLLBAR-ARROW-COLOR: rgb(93,232,255);//上下按钮上三角箭头的颜色
SCROLLBAR-TRACK-COLOR: rgb(255,70,130);//滚动条的背景颜色
SCROLLBAR-DARKSHADOW-COLOR: rgb(10,0,209);//滚动条强阴影的颜色
SCROLLBAR-BASE-COLOR: rgb(66,93,128)；//滚动条的基本颜色

</STYLE>

我把它加入<head>中，没反应，高手帮我解决一下阿，谢谢。

请使用，类似下面的颜色代码试试：
scrollbar-face-color:#0B5EB3;
scrollbar-highlight-color:#0B5EB3;
scrollbar-shadow-color:#0B5EB3;
scrollbar-3dlight-color:#0B5EB3;
scrollbar-arrow-color:#000000;
scrollbar-track-color:#C6DBE7;
scrollbar-darkshadow-color:#008000; 参考技术A 此方法对IE5.5以下浏览器无效，win2000默认安装的是5.0。
winxp没有问题！

以上是关于如何设置滚动条的宽度及颜色？的主要内容，如果未能解决你的问题，请参考以下文章