CSS滚动条优化设计之滚动条颜色设计详细教程

CSS滚动条优化设计之滚动条颜色设计详细教程

我们知道用overflow可以控制显示滚动条，这里我就来详细介绍优化滚动条，可以来设置滚动条各个属性的颜色来设置优化滚动条。详细的具体的教程如下，用实际代码和执行效果来说明问题，希望能帮到各位。

我们首先来看看默认的滚动条的样式，具体代码如下：

设置200px的正方形的红色背景的矩形框，并给这个框添加滚动条，可以看到默认的滚动条的效果。

设置滚动条的亮边框为绿色，具体代码如下：

可以看到如下图的执行效果。

设置滚动条3D界面亮边为绿色，具体代码如下：

可以看到，滚动条的绿色部分

设置滚动条的箭头的颜色为绿色，具体的代码如下：

如下图所示的执行结果，可看出滚动条的箭头变成了绿色了。

设置滚动条的基准颜色为绿色，具体代码如下：

如下图，是不是可以发现滚动条的基准颜色变成了绿色了。

设置滚动条的3D暗边为黄色，具体代码如下

可以看到如下图的执行效果