我有一个父元素，我想在父元素中设置元素的高度。例如：
<div id="parent">
<p id="child"></p>
</div>
现在我们知道，为了设置“孩子”的高度，我们必须在“父”上设置一些高度值。否则，单独在“child”上设置任何高度值都没有效果。
#parent { height: 200px; }
#child { height: 75%; }
这会将“child”的高度设置为200px的75％。如果我们删除“父”的高度，“child”将不会设置任何高度。
现在，我发现不是设置高度，如果我们将“父”的定位设置为绝对，我们可以在不设置任何高度的情况下离开，并且“孩子”上的高度值将会还在工作：
#parent { position: absolute; top: 0; bottom: 0; }
#child { height: 75%; }
我想知道的是这是一种标准行为还是偶然发生的事情。另外，如果它是标准的，这是否意味着给元素一个布局（通过设置它的位置）会给它一些隐含的高度值？
答案 0 :(得分：5)
基本思想是这样的：对于绝对定位的元素，如果在相对侧设置偏移（例如left和right，或top和bottom ）为零，然后元素将分别拉伸到其包含块的宽度或高度。
这不仅是一种常用技巧，而且也是一种标准行为。规范中的血腥细节是here;关键在于这个等式：
对于绝对定位的元素，垂直维度的使用值必须满足此约束：
'top'+'margin-top'+'border-top-width'+'padding-top'+'height'+'padding-bottom'+'border-bottom-width'+'margin-bottom' +'bottom'=包含块的高度
（这是用于计算高度;还有一个用于计算宽度的对应公式，可以找到here。）
因此，假设所有其他值的默认值，这意味着
0 + 0 + 0 + 0 +'height'+ 0 + 0 + 0 + 0 =包含块的高度
绝对定位元素的包含块（其祖先全部是静态的）始终是视口（或初始包含块），其通常与浏览器的查看区域具有相同的高度（或jsFiddle中的结果iframe例如）。这创造了我刚才描述的效果。
因为您没有为父元素指定显式高度，所以这为计算子元素as a percentage的高度提供了隐式高度：
百分比是根据生成的框containing block的高度计算的。
事实上，即使您将top和/或bottom设置为某个非零值，这些框也会根据上述等式进行缩放。
另请注意，“生成的框的包含块的高度”不是指该块的height的指定值或计算值，而是指使用的值，即在屏幕上渲染时计算的高度。这可能是你在没有在父元素上设置height而逃脱的原因混淆的原因，但浏览器仍然知道如何根据一些隐式高度来计算子元素的高度。
答案 1 :(得分：0)
当然，是的。这是一种标准行为。
始终为top: 0;元素设置bottom: 0;和absolute时，表示将height设置为父height值。例如，考虑relative元素与height: 400px;，如果您有absolute子元素top: 0;和bottom: 0;，则子元素也将为{{} 1}}
height: 400px;