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

css自定义滚动条样式-不支持FF

2013-01-09 12:41 585 查看

转载于：http://www.jiaoben8.cn/Article-id198.html

不等不说，每个浏览器都有自己的脾气，好不容易讨好其他浏览器，但偏偏在你这里雷打不动，我恨你火狐ψ(╰_╯)
html代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>css自定义滚动条样式-不支持FF</title>
<link rel="stylesheet" type="text/css" media="all" href="css/style.css" />
</head>
<body>
<div style="height:1200px;"></div>
</body>
</html>
css样式：
::-webkit-scrollbar-track-piece{background-color:#ccc}//内层轨道，滚动条中间部分（除去）
::-webkit-scrollbar{width:15px;height:15px;}//滚动条整体部分
::-webkit-scrollbar-thumb{background-color:#999;background-clip:padding-box;min-height:30px}//（拖动条？滑块？滚动条里面可以拖动的那个，肿么翻译好呢？）
::-webkit-scrollbar-thumb:hover{background-color:#aaa}//不用解释了吧
HTML{
SCROLLBAR-FACE-COLOR:#999; //滚动条凸出部分的颜色
SCROLLBAR-SHADOW-COLOR:#999;//立体滚动条阴影的颜色
SCROLLBAR-HIGHLIGHT-COLOR:#999; //滚动条空白部分的颜色
SCROLLBAR-3DLIGHT-COLOR:#999;//滚动条亮边的颜色
SCROLLBAR-DARKSHADOW-COLOR:#999;//滚动条强阴影的颜色
SCROLLBAR-TRACK-COLOR:#ccc;//滚动条的背景颜色
SCROLLBAR-ARROW-COLOR:#eee;//上下按钮上三角箭头的颜色
}
预览效果地址：http://www.jiaoben8.cn/Specia-id199.html

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航