码迷,mamicode.com
首页 > 其他好文 > 详细

更改scroll样式

时间:2016-11-23 20:00:40      阅读:129      评论:0      收藏:0      [点我收藏+]

标签:http   code   box   plugin   滑块   track   hub   height   scrollbar   

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/  
::-webkit-scrollbar  
{  
    width: 2px;  
    height: 80%;
    background: #fff;
}  
  
/*定义滚动条轨道 内阴影+圆角*/  
::-webkit-scrollbar-track  
{  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  
    border-radius: 10px;  
    background-color: #F5F5F5;  
}  
  
/*定义滑块 内阴影+圆角*/  
::-webkit-scrollbar-thumb  
{  
    border-radius: 10px;  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);  
    background-color: #555;  
}  

注:不支持IE和ff浏览器!只能用插件(https://github.com/malihu/malihu-custom-scrollbar-plugin)

更改scroll样式

标签:http   code   box   plugin   滑块   track   hub   height   scrollbar   

原文地址:http://www.cnblogs.com/zzd0916/p/6094502.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!