css修改滚动条样式的例子

发布时间:2020-12-03编辑:脚本学堂
分享一个css控制修改滚动条样式的例子,一个滚动条样式的例子,通过修改各个属性值可以改变滚动条的样子。

例子,css滚动条样式代码。
 

复制代码 代码示例:
<html>
<head>
<meta http-equiv="content-language" content="zh-cn">
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<title>用css控制滚动条样式_www.jb200.com</title>
<style>
body {
scrollbar-face-color: #fcfcfc;
 scrollbar-highlight-color: #6c6c90;
 scrollbar-shadow-color: #fcfcfc;
 scrollbar-3dlight-color: #fcfcfc;
 scrollbar-arrow-color: #240024;
 scrollbar-track-color: #fcfcfc;
 scrollbar-darkshadow-color: #48486c;
 scrollbar-base-color: #fcfcfc
}
</style>
</head>
<body>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>

滚动条样式属性说明:
 

scrollbar-face-color: 滚动条凸出部分的颜色
scrollbar-highlight-color: 滚动条空白部分的颜色
scrollbar-shadow-color: 立体滚动条阴影的颜色
scrollbar-3dlight-color: 滚动条亮边的颜色
scrollbar-arrow-color: 上下按钮上三角箭头的颜色
scrollbar-track-color: 滚动条的背景颜色
scrollbar-darkshadow-color: 滚动条强阴影的颜色
scrollbar-base-color: 滚动条的基本颜色