Html css - 删除垂直滚动条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21296827/
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
css - Vertical scroll bar remove
提问by abrahab
Below is the code of the menu line with left&right additional images. I need the behavior: when resolution of the screen width something from 960px to 1398px -- left&right divs hides simultaneously. This code DO what I want exactly! The problem is that on the low screen width (960px to 1398px) it adds horizontal scroll bar to the browser :( But on my idea vertical scroll only need for screen width less that 960px. Any suggestions how to solve this? thanks.
下面是带有左右附加图像的菜单行的代码。我需要的行为：当屏幕宽度的分辨率从 960 像素到 1398 像素时——左右 div 同时隐藏。这段代码完全符合我的要求！问题是在低屏幕宽度（960px 到 1398px）上，它向浏览器添加了水平滚动条 :( 但在我的想法中，垂直滚动只需要屏幕宽度小于 960px。有什么建议可以解决这个问题吗？谢谢。
html:
html：
<div class="bxt">
<div class="boxone"></div>
<div class="center"></div>
<div class="boxtwo"></div>
</div>
css:
css：
.bxt{
width:960px;
height:72px;
margin:0 auto;
position:relative;
/*background-color:#000 */
}
.bxt div{
position:absolute;
width:219px;
/* background:#CCCCCC; */
top:0;
height:72px;
margin:0 0 0 0;
}
.bxt div.boxone{
left:-219px;
margin:0 0 0 0;
background-image:url(images/i_02.jpg)
}
.bxt div.boxtwo{
right:-219px;
margin:0 0 0 0;
background-image:url(images/i_04.jpg)
}
.bxt div.center{
width:960px;
height:72px;
right:0;
/* background:#AAAAAA; */
background-image:url(images/i_03.jpg);
}
回答by Charlie
You could use a media query:
您可以使用媒体查询：
body{
overflow-y:hidden;
}
@media only screen and (max-width:960px){
body{
overflow-y:scroll;
}
}
That will hide the scroll bar when the browser window is less than than 960pxin width.
当浏览器窗口小于960px宽度时，这将隐藏滚动条。
回答by vincent kleine
body{
overflow-y:hidden;
}
Like this?
像这样？
