css高度之间的差异:100%vs height:auto

Question

我在接受采访时被问到"css height:100%和height:auto？之间有什么区别？"

可以解释一下吗？

Answer 1

height:100% 暗示元素将具有其父容器的100%高度.

height:auto 意味着,该元素将具有灵活的高度,即其高度将取决于其子元素的高度

考虑下面的例子:

身高:100%

<div style="height:50px">
    <div id="innerDiv" style="height:100%">
    </div>
</div>

#innerDiv 会有 height:50px

高度:汽车

<div style="height:50px">
    <div id="innerDiv" style="height:auto">
          <div id="evenInner" style="height:10px">
          </div>
    </div>
</div>

现在#innerDiv将会有height:10px

Answer 2

height:100% 如果父容器具有指定的高度属性，则有效，否则，它将不起作用

Answer 3

一个100％的高度的是，据推测，您的身高浏览器的内部窗口，因为这是其母公司的高度，页面。的auto高度将是最小高度的必要遏制。