您的位置:首页 > Web前端 > CSS

网页滚动条样式

2009-03-16 16:43 260 查看
网页滚动条样式

应用:

没有水平滚动条
<body style="overflow-y:scroll;overflow-x:hidden;">

没有垂直滚动条
style="overflow-y:hidden"

没有滚动条
style="overflow-x:hidden;overflow-y:hidden" 或 style="overflow:hidden"

2.自己定义滚动条的颜色

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

应用实例:

定义窗口滚动条的颜色(IE5.5+):

代码:
BODY {
scrollbar-face-color: #C5D5FC; 全局颜色
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #C5D5FC;
scrollbar-darkshadow-color: #7C9FD3;
scrollbar-track-color: #FFFFFF; 滚动条下面颜色
scrollbar-arrow-color: #4D6185; 三角型颜色
}

设置多行文本框的颜色:

代码:
<textarea style="scrollbar-face-color: #C5D5FC;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #C5D5FC;
scrollbar-darkshadow-color: #7C9FD3;
scrollbar-track-color: #FFFFFF;
scrollbar-arrow-color: #4D6185;">

…………

</textarea>

以上2项适用与<body>、<div>、<textarea>、<iframe>等
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: