网页制作技巧文章之用CSS定义滚动条的颜色

2022-07-15 80酷酷网 80kuku.com

　　css|技巧|网页请看下面的案例。这组代码可能并不具有观赏性，但是它改变了传统滚动条的样式。你可以通过改变其中的代码来创建你所喜欢的滚动条样式。事实上，这些代码都极具自我描述性。不管怎样，还是让我们好好看看吧！
<STYLE TYPE="text/css">
BODY
{
scrollbar-face-color: green;
scrollbar-shadow-color: blue;
scrollbar-highlight-color: black;
scrollbar-3dlight-color: red;
scrollbar-darkshadow-color: brown;
scrollbar-track-color: yellow;
scrollbar-arrow-color: white;
}
</STYLE>
你必须将上述代码插入页面的<head></head>标签纸内来改变滚动条的样式。颜色名称如：green[绿]、blue[蓝]等等，这些名称可以直接用于替代诸如：#000000这样的六位颜色代码。

下面这张图片展示了用于定义滚动条的样式代码。我想不需要再过多地说明了，因为每个语句的解释都已经很清楚了。那么，赶快试试它们，让你的页面看上去更加美观吧！
网页制作技巧文章之用定义滚动条的颜色

下面这段代码是我在自己的页面中所使用的。如果你喜欢也可以自由地使用它。
<STYLE TYPE="text/css">
BODY
{
scrollbar-face-color: #EAEAEA;
scrollbar-shadow-color: #EAEAEA;
scrollbar-highlight-color: #EAEAEA;
scrollbar-3dlight-color: #EAEAEA;
scrollbar-darkshadow-color: #697074;
scrollbar-track-color: #F7F7F7;
scrollbar-arrow-color: #666666;
}