CSS滚动条样式如何兼容IE8和Chrome浏览器()
【CSS滚动条样式如何兼容IE8和Chrome浏览器()】针对IE8:
html,body {
scrollbar-face-color:#FB4446;
/*滚动条3D表面(ThreedFace)的颜色*/
scrollbar-highlight-color:#fff;
/*滚动条3D界面的亮边(ThreedHighlight)颜色*/
scrollbar-shadow-color:#eeeeee;
/*滚动条3D界面的暗边(ThreedShadow)颜色*/
scrollbar-3dlight-color:#eeeeee;
/*滚动条亮边框颜色*/
scrollbar-arrow-color:#000;
/*滚动条方向箭头的颜色 */
scrollbar-track-color:#fff;
/*滚动条的拖动区域(TrackBar)颜色*/
scrollbar-darkshadow-color:#fff;
/*滚动条暗边框(ThreedDarkShadow)颜色*/ }
针对Chrome:
/*---滚动条默认显示样式--*/
::-webkit-scrollbar-thumb{
background-color:#FB4446;
height:50px;
outline-offset:-2px;
outline:2px solid #fff;
-webkit-border-radius:4px;
border: 2px solid #fff;
}
/*---鼠标点击滚动条显示样式--*/
::-webkit-scrollbar-thumb:hover{
background-color:#F01360;
height:50px;
-webkit-border-radius:4px;
}
/*---滚动条大小--*/
::-webkit-scrollbar{
width:8px;
height:8px;
}
/*---滚动框背景样式--*/
::-webkit-scrollbar-track-piece{
background-color:#fff;
-webkit-border-radius:0;
}
推荐阅读
- 家乡的那条小河
- 每日一话(49)——一位清华教授在朋友圈给大学生的9条建议
- 标签、语法规范、内联框架、超链接、CSS的编写位置、CSS语法、开发工具、块和内联、常用选择器、后代元素选择器、伪类、伪元素。
- 人生是一条孤独又迷茫的路
- (七)谈条件
- 我在一条路上走了5年
- 那条灰色的人行道
- 无尾鱼与独脚鸟
- 墙角的小花
- 感赏15+投射