给div一个样式='高度:100%'是什么意思?

时间:2012-06-22 15:46:10

标签: html css

关于SO的问题有很多问题,但我扫描的问题都是针对具体的具体情况。我想知道的是,在概念层面上,它的含义是什么:

<div style='height:100%'>

100%有多高? 100%的是什么?

[编辑]

后续问题:如果100%表示父级的高度,但父级是&lt; body&gt;除了div的高度之外没有高度,那是什么意思?它似乎是递归定义的。

4 个答案:

答案 0 :(得分:5)

offsetParent的100%。在大多数情况下,这就是文件。它也可以是除position以外的static元素或表格的组件。

答案 1 :(得分:5)

父容器高度的100%。

见这里:http://jsfiddle.net/6VRn6/

如果您想使用此方法将div设为页面高度的100%,则必须将高度指定为正文的100%和html。

body, html {
  height: 100%;
}

如果您未指定htmlbody高度,则其高度是其中元素高度的总和。

Updated demo显示了这一点。我们有一个200px div,2px边框总共204px,然后是40px状态div。 body高度应为244px。现在,如果您将上面的CSS添加到页面,高度将是jsfiddle右下象限的高度。尝试添加它并再次运行代码。然后调整结果窗格的大小并再次运行它以相应地查看高度变化。

答案 2 :(得分:1)

高度:100%表示:      让那个div成为父母!

答案 3 :(得分:0)

只是意味着100%的 div class tag 封闭在内。尝试一下这个想法:

{--parent loop { ..height 100% of above loop .. } }