滚动条设置
chrome css 样式设置
/* 滚动条样式 .wrap为滚动盒子的class*/
/* chrome */
.wrap::-webkit-scrollbar {/*滚动条整体样式*/
width: 4px; /*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
.wrap::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
border-radius: 4px;
background: #A1A1A1;
}
.wrap::-webkit-scrollbar-track {/*滚动条里面轨道*/
border-radius: 4px;
background: #F9F9F9;
margin: 30px 0;
}
ie 浏览器样式
/* ie */
.wrap{
scrollbar-arrow-color: #A1A1A1; /**//*三角箭头的颜色*/
scrollbar-face-color: #A1A1A1; /**//*立体滚动条的颜色*/
scrollbar-3dlight-color: transparent; /**//*立体滚动条亮边的颜色*/
scrollbar-highlight-color: transparent; /**//*滚动条空白部分的颜色*/
scrollbar-shadow-color: transparent; /**//*立体滚动条阴影的颜色*/
scrollbar-darkshadow-color: transparent; /**//*立体滚动条强阴影的颜色*/
scrollbar-track-color: #F9F9F9; /**//*立体滚动条背景颜色*/
scrollbar-base-color: transparent; /**//*滚动条的基本颜色*/
}
火狐浏览器目前没有找到兼容的样式
网友评论