1、滚动条的设置在CSS中不能简简单单就完成,必竟它是由好多部分组成。所以我们如果想要设置滚动条就要先知道哪些是控制哪些部分的。下面一一介绍:scrollbar-face-color :/*滑块颜色*/scrollbar-arrow-color:/*箭头颜色*/scrollbar-shadow-color:/*滑块边线颜色*/scrollbar-track-color:/*滑轨颜色*/既然已经知道这些设置项,我们就可以着手去设置了。

3、做网页设计有一个让人头疼的问题就是解决兼容性。刚刚我们是在IE11下进行的测试。做滚动条设置不能只针对IE浏览器来做,所以有必要再换浏览器测试试。这里小编使用谷哥做了一个测试,结果妥妥的没效果。

5、继续添加以下代码::-webkit-scrollbar{background-color: #000} ::-webkit-scrollbar-track { background-color: #7dc2f6; } ::-webkit-scrollbar-thumb { background-color: #1b99f7; } ::-webkit-scrollbar-button { background-color: #b9e0fd; } ::-webkit-scrollbar-corner { background-color: #018ef8; }再次测试输出,现在IE和谷哥类浏览器都能看到变化了。

6、接下来再看看如何隐藏滚动条。对于浏览器滚动条而言如果同时隐藏横向和纵向滚动条可以直接使用overflow:hidden即可。如果单一方向隐藏,可以做单方向的隐藏。如:html{overflow-x:hidden;/*横向隐藏*/overflow-y:hidden;/*纵向隐藏*/}好了滚动条设置就讲到这里了,你学会了吗?