css设置超出部分滚动条隐藏的方法
这篇文章主要介绍css设置超出部分滚动条隐藏的方法，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
创新互联是一家专注于网站制作、成都网站制作与策划设计,修武网站建设哪家好?创新互联做网站,专注于网站建设十年,网设计领域的专业建站公司;建站业务涵盖:修武等地区。修武做网站价格咨询:18980820575
方法：1、使用“-webkit-scrollbar”属性设置，语法“-webkit-scrollbar{display:none;}”；2、在父元素div里设置“overflow: hidden”样式，并为父元素和子元素设置宽度。
本教程操作环境：windows7系统、HTML5&&CSS3版、Dell G3电脑。
方法一、 利用 css 3 的新特性 -webkit-scrollbar, 但是这种方式不兼容 火狐 和 IE
超出部分隐藏滚动条
#box {
width: 500px;
height: 300px;
overflow-x: hidden;
overflow-y: scroll;
line-height: 30px;
text-align: center;
}
#box::-webkit-scrollbar {
display: none;
}
你好 你好
你好 你好
你好 你好
你好 你好
你好 你好
你好 你好
你好 你好
方法二、利用内外层嵌套, 模拟, 兼容所有浏览器, 相对于方法一比较麻烦, 使用时不能对滚动条声明任何样式
超出部分滚动条
#box {
/* 父容器设置宽度, 并超出部分不显示 */
width: 500px;
height: 300px;
overflow: hidden;
}
#box > div {
/* 子容器比父容器的宽度多 17 px, 经测正好是滚动条的默认宽度 */
width: 517px;
height: 300px;
line-height: 30px;
text-align: center;
overflow-y: scroll;
}
你好 你好
你好 你好
你好 你好
你好 你好
你好 你好
你好 你好
你好 你好
以上是“css设置超出部分滚动条隐藏的方法”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联行业资讯频道！
文章标题：css设置超出部分滚动条隐藏的方法
标题URL：
http://cdxtjz.cn/article/ppsgop.html
