我在页面的左侧有一个导航栏,我想让它伸展到页面高度的100%。不仅是视口的高度,还包括滚动之前隐藏的区域。我不想用javascript来完成这个。
它能在HTML/CSS中完成吗?
我在页面的左侧有一个导航栏,我想让它伸展到页面高度的100%。不仅是视口的高度,还包括滚动之前隐藏的区域。我不想用javascript来完成这个。
它能在HTML/CSS中完成吗?
当前回答
此代码工作,但不完全支持:
height: 100svmax;
浏览器支持
其他回答
此代码工作,但不完全支持:
height: 100svmax;
浏览器支持
在HTML5中,最简单的方法就是设置高度:100vh。其中“vh”代表浏览器窗口的视口高度。响应浏览器和移动设备的大小调整。
* {
margin: 0;
}
html, body {
height: 90%;
}
.content {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto ;
}
如果你的目标是更现代的浏览器,事情可以非常简单。 试一试:
.elem{
height: 100vh;
}
如果你需要它在页面的50%,将100替换为50。
我成功地
min-height: 100vh
对于两者,菜单和内容div。