Html 在 div 溢出时禁用垂直滚动条:自动
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7646538/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable vertical scroll bar on div overflow: auto
提问by joedborg
Is it possible to allow only a horizontal scroll bar when using overflow:auto (or scroll)?
使用溢出时是否可以只允许水平滚动条:自动(或滚动)?
回答by Luke
These two CSS properties can be used to hide the scrollbars:
这两个 CSS 属性可用于隐藏滚动条:
overflow-y: hidden; // hide vertical
overflow-x: hidden; // hide horizontal
回答by Siva Charan
You should use only
你应该只使用
overflow-y:hidden;
- Use this for hiding the Vertical scroll
overflow-y:hidden;
- 使用它来隐藏垂直滚动
overflow-x:auto;
- Use this to show Horizontal scroll
overflow-x:auto;
- 使用它来显示水平滚动
Luke has mentioned as both hidden. so I have given this separately.
卢克曾提到两者都是隐藏的。所以我单独给出了这个。
回答by Random Guy
overflow: auto;
overflow-y: hidden;
溢出:自动;
溢出-y:隐藏;
For IE8: -ms-overflow-y: hidden;
对于 IE8:-ms-overflow-y:隐藏;
Or Else :
要不然 :
To hide X:
隐藏 X:
<div style="height:150x; width:450px; overflow-x:hidden; overflow-y: scroll; padding-bottom:10px;"></div>
To hide Y:
隐藏 Y:
<div style="height:150px; width:450px; overflow-x:scroll ; overflow-y: hidden; padding-bottom:10px;"></div>
回答by Nirav Mehta
If you want to accomplish the same in Gecko (NS6+, Mozilla, etc) and IE4+ simultaneously, I believe this should do the trick:V
如果您想同时在 Gecko(NS6+、Mozilla 等)和 IE4+ 中完成相同的操作,我相信这应该可以解决问题:V
body {
overflow: -moz-scrollbars-vertical;
overflow-x: hidden;
overflow-y: auto;
}
This will be applied to entire body tag, please update it to your relevant css and apply this properties.
这将应用于整个 body 标签,请将其更新为您的相关 css 并应用此属性。
回答by Zeinab
Add the following:
添加以下内容:
body{
overflow-y:hidden;
}
回答by tamueka
This rules are compatible whit all browser:
此规则与所有浏览器兼容:
body {overflow: hidden; }
body::-webkit-scrollbar { width: 0 !important; }
body { overflow: -moz-scrollbars-none; }
body { -ms-overflow-style: none; }
回答by Tahir Alvi
if you want to disable the scrollbar, but still able to scroll the content of inner DIV, use below code in css,
如果您想禁用滚动条,但仍然能够滚动内部 DIV 的内容,请在 css 中使用以下代码,
.divHideScroll::-webkit-scrollbar {
width: 0 !important
}
.divHideScroll {
overflow: -moz-scrollbars-none;
}
.divHideScroll {
-ms-overflow-style: none;
}
divHideScroll is the class name of the target div.
divHideScroll 是目标 div 的类名。
It will work in all major browser (Chrome, Safari, Mozilla, Opera, and IE)
它适用于所有主流浏览器(Chrome、Safari、Mozilla、Opera 和 IE)