Question

这是我的代码：

...
<STYLE>
body{
    position: static;
    height: 95%;
    width: 95%;
    border: 2px;
    border-style: solid;
    border-radius: 5px;
    border-color: black;
    background-color: pink;
    }
<STYLE>
...
<body>
<DIV id="div_1" >
    <DIV id="div_2a" >
        </DIV>
    <DIV id="div_2b"  >
        </DIV>
</DIV>
</BODY>
...

虽然高度和宽度指定为95％，但宽度有效，但高度会崩溃，显然是因为div没有内容。这完全违反直觉。加上侮辱情况，背景颜色延伸到边界外并填充可见页面区域。这是某种默认的身体css声明的功能吗？如果是这样的话是什么？我怎么能阻止这种行为？如果将css更改为引用HTML，则行为是直观的因为边框不会折叠，但背景颜色会延伸到边框之外。在这这似乎是一个错误。

Answer 1

您指定body的高度为95％，这意味着它将占据父母身高的95％。因此，给它的父级html标记一个高度，也会使你的body占据高度。

html {
    height: 100%;
    margin: 0;
    padding: 0;
}
body{
    height: 95%;
    width: 95%;
    border: 2px;
    border-style: solid;
    border-radius: 5px;
    border-color: black;
    background-color: pink;
}

为什么当指定为非零时，身高呈现为零

1 个答案: