使html和身体舒展到100%的高度和更多,如果页面滚动 [英] Making html and body stretch to 100% height and more if the page scrolls
问题描述
我想让我的< html>
和< body>
viewport如果页面不够高,不足以保证滚动,或者网页的整个高度,如果这样。
I want to make my <html>
and <body>
tags be the entire height of the viewport if the page isn't tall enough to warrant scrolling, or the entire height of the web page if it does.
目前我使用这个CSS:
At the moment I'm using this CSS:
html, body {
height: 100%;
}
如果网页对用户而言不够高滚动,但是在长的网页上,它只会到达用户浏览器上的视口的高度。我也试过:
Which works a treat if the web page isn't tall enough for the user to scroll, however on a long webpage it only goes to the height of the viewport on the users browser. I also tried:
html, body {
min-height: 100%;
}
但是这似乎与没有 height
声明。
but that just seems to have the same effect as having no height
declaration at all.
推荐答案
听起来你的目标是让身体
It sounds like your goal is for the body to
- 始终覆盖屏幕(内容很少或没有内容)
- 是一吨内容)
如果是这样,以下代码段应该有帮助。
if that's the case the following snippet should help
/* this looks like it should work
html, body{
min-height: 100%;
}
but this ↓ does the trick */
html, body{
padding: 0;
margin: 0;
}
html{
height: 100%;
}
body{
min-height: 100%;
}
这篇关于使html和身体舒展到100%的高度和更多,如果页面滚动的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!