在360浏览器中设置滚动条隐藏样式 以下 可直接实现隐藏功能
1 ::-webkit-scrollbar {/*隐藏滚轮*/ 2 display: none; 3 }
如果要兼容 PC 其他浏览器(Firefox 、IE6、IE8、Google等)设置滚动条隐藏样式,在容器(div)外面再嵌套一层 overflow:hidden
内部边框宽高限制尺寸和外部嵌套在一起,就可以隐藏了(内部把外部的滚动条给覆盖了)!
1 2 3 4 5无标题文档 6 53 54 55 56 67 68
overflow属性: 检索或设置当对象的内容超过其指定高度及宽度时如何显示内容,其用到的表现形式和值有以下几种
overflow: auto; 在需要时内容会自动添加滚动条
overflow: scroll; 总是显示滚动条
overflow-x: hidden; 禁止横向的滚动条
overflow-y: scroll; 总是显示纵向滚动条
/* 去掉竖向滚动条*/
/*两个都去掉*/
以上三个属性设置的值为visible、scroll、hidden、auto
visible 默认值。使用该值时,无论设置的"width"和"height"的值是多少,其中的内容无论是否超出范围都将被强制显示。
hidden 效果与visible相反。任何超出"width"和"height"的内容都会不可见。
scroll 无论内容是否超越范围,都将显示滚动条。
auto 当内容超出范围时,显示滚动条,否则不显示。
滚动条overflow属性的应用
1 2 /*没有水平滚动条*/ 3 4 /*没有垂直滚动条*/ 5 6 /*没有滚动条*/ 7
8 /*自动显示滚动条*/
9name
自定义滚动条的样式实例
1 Body {}{ 2 scrollbar-arrow-color: #f4ae21; /*三角箭头的颜色*/ 3 scrollbar-face-color: #333; /*立体滚动条的颜色*/ 4 scrollbar-3dlight-color: #666; /*立体滚动条亮边的颜 5 色*/ 6 scrollbar-highlight-color: #666; /*滚动条空白部分的 7 颜色*/ 8 scrollbar-shadow-color: #999; /*立体滚动条阴影的颜 9 色*/ 10 scrollbar-darkshadow-color: #666; /*立体滚动条强阴 11 影的颜色*/ 12 scrollbar-track-color: #666; /*立体滚动条背景颜色*/ 13 scrollbar-base-color:#f8f8f8; /*滚动条的基本颜色*/ 14 Cursor:url(mouse.cur); /*自定义个性鼠标*/ 15 }