HTML – 当他们的身高达到100%时,各种位置值对身体的孩子有什么影响?

基本上任何人都可以解释这个:

Because body isn’t positioned (or more accurately, it’s
position:static by default), setting a child element to height:100%
causes it to be 100% of the height of the html element, not the body
element. Thus, if you want something to be as tall as the body is
(going down past the bottom of the page) use body { position:relative }

此声明取自:http://phrogz.net/css/htmlvsbody.html它位于页面底部.

最佳答案 这篇文章是不正确的.为了实现这一目标,不需要给身体贴上标签. body标签不需要有位置:relative;为了让一个元素占据它的高度.

为了使身体标签的孩子具有基于身体标签的百分比的高度,您应该给身体一个高度.要使body标签的高度为100%,您还必须为html标记指定100%的高度.

例如:JS Fiddle

html, body {
    height: 100%;
}
div {
    height: 100%;
    background: blue;
    width: 100%;
}

现在,身体的直接孩子可以给出与身体相关的高度,因为身体的高度是定义的.

这条线完全错了:

setting a child element to height:100% causes it to be 100% of the
height of the html element, not the body element

例如,如果删除body标记的height属性,则子标记不会占用html标记的100%高度:JS Fiddle

点赞