Question

有两个问题。

首先，如果div上没有设置高度，并且没有元素包含在里面，它们根本不显示？
其次，根据第一个问题，如果我想显示一个 div为身高的90％，水平和水平居中垂直，即使里面没有内容，也是什么需要css吗？

Answer 1

欢迎来到定位的魔力，自动计算高度：

#myemptydiv{
    position:absolute;
    top: 5%;    // height gets calculated automatically
    bottom: 5%;
    width: 600px;
    margin: auto;
}

所以，回答你的第一个问题：不，至少如果没有使用定位的隐含高度。第二个问题由上面给出的代码回答。

另见：

Answer 2

要使div（或任何块元素）完全居中，您应该将绝对定位与负边距结合使用。看看这里：enter link description here。尝试调整窗口大小：它的定位会自动发生。

div {
    width: 90%;  /* Can be a non-percentual number */
    margin-left: -45%; /* negative value of element's width/2 | Can be a non-percentual number */
    margin-top: -45%; /* negative value of element's height/2 | Can be a non-percentual number */
    height: 90%;  /* Can be a non-percentual number */
    position: absolute;
    top: 50%; /* must always be 50% */
    left: 50%; /* must always be 50% */
    border: 1px solid;
}

当然，当你只使用百分比值时，更容易进行数学计算：50％ - 45％= 5％（正如Zeta的帖子建议的那样）但是我使用这种方法来证明这与非百分比值。 Example

div {
    width: 320px;
    margin-left: -160px; /* negative value of element's width/2 */
    margin-top: -120px; /* negative value of element's height/2 */
    height: 240px;
    position: absolute;
    top: 50%; /* must always be 50% */
    left: 50%; /* must always be 50% */
    border: 1px solid;
}

当一个元素没有特定的高度并且没有内容时，你就看不到它了。它将具有自动宽度（通常为100％）但没有高度。您可以通过添加边框来显示它：http://jsfiddle.net/TALAA/2/

显示没有任何内容的div？

2 个答案: