Zao's Blog
感谢上天,我不是一个人在战斗!

你可能会注意到当你浏览某些网站时,浏览器滚动条的颜色不是默认的那样,这是因为它用了css控制滚动条的颜色。

滚动条相关CSS参数 详细说明如下:
scrollbar-3dlight-color: 滚动条亮边的颜色
scrollbar-arrow-color: 上下按钮上三角箭头的颜色
scrollbar-base-color: 滚动条的基本颜色
scrollbar-darkshadow-color: 滚动条强阴影的颜色
scrollbar-3dlight-color: 滚动条凸出部分的颜色
scrollbar-highlight-color:滚动条空白部分的颜色
scrollbar-shadow-color: 立体滚动条阴影的颜色
scrollbar-track-color: 滚动条的背景颜色

scrollbar-base-color 这个属性是个其余7个属性的总合,当你设定了这个属性的颜色后,其余7个属性都可以不用设置了,浏览器会自动帮你设定的,只是这个设定是基于scrollbar-base-color的颜色而自动设定。
:设定了scrollbar-base-color就不要设定其他七个属性了,设定了其他七个属性就不要设定scrollbar-base-color,不然之间可能会有冲突,影响作用效果。

只看css参数说明可能比较难理解,请看下面图解:
滚动条css图解

我在网上发现了Danger做的一个很好用的在线设置滚动条样式工具——通用滚动条配色工具(请在flash中选择“CSS”选项):
☞显示/隐藏媒体文件 »

另外要注意,自定义滚动条样式是IE5.5以上专有属性,仅当没有声明文档为XHTML时才可以在Opera中起产生作用。由于IE的用户群体很庞大,有时设置一下滚动条也是有用的。

发表评论





改变评论框高度:增大(+) | 减小(-)