CSS Box说明 - 影响高度的内边距和外容器边界

Question

我无法理解这个问题但是如果从div元素中移除边框样式，那么基本div包含内部div，那么整个框的高度会受到影响吗？ 有人可以帮我解释一下吗？

<div style="background-color:red;border:1px solid black;">
    <div style="margin:10px;background-color:blue;border:1px solid black;">
        <p style="margin:30px;background-color:gray;border:1px solid black;">test</p>
    </div>
</div>

你能模仿这个吗？如果删除边框样式，高度是否会改变？ 希望有人可以对此有所了解 非常感谢！

Answer 1

高度（和宽度）由css宽度，高度（或宽度），边距和填充的总和决定。这就是CSS Box模型和W3Schools的详细explanation。

Answer 2

当您添加边框时，它会将您指定的任意数量的像素添加到元素的外部，因此从这个意义上说，它将更改元素的高度。

如果它没有固定的高度，它将影响它所在的​​div的高度。

希望这会有所帮助。