[英]css - Vertical scroll bar remove
下面是带有左右附加图像的菜单行代码。 我需要这样的行为:当屏幕宽度分辨率从960px到1398px时 - 左右div同时隐藏。 这段代码完全符合我的要求! 问题是在低屏幕宽度(960px到1398px)上它向浏览器添加水平滚动条:(但在我的想法垂直滚动只需要屏幕宽度小于960px。任何建议如何解决这个问题?谢谢。
HTML:
<div class="bxt">
<div class="boxone"></div>
<div class="center"></div>
<div class="boxtwo"></div>
</div>
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);
}
您可以使用媒体查询 :
body{
overflow-y:hidden;
}
@media only screen and (max-width:960px){
body{
overflow-y:scroll;
}
}
当浏览器窗口的宽度小于960px
时,这将隐藏滚动条。
body{
overflow-y:hidden;
}
像这样?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.