块状元素如何影响父元素高度？

子元素类型如何影响父元素高度？

在 HTML 中，外层盒子 <div class="outerbox1"> 被设置了 line-height: 300px 的行高。内部<span>元素最初设置为内联元素，这意味着它采用外层盒子的行高。

但是，当我们更改<span>元素的 display 属性为 block 时，它的高度发生变化。原因在于：

• 当<span>元素为内联元素时，其高度由它的内容决定，而父元素的行高不会影响它。
• 当<span>元素为块状元素时，它将创建一个独立的块，占据父元素的高度。父元素的行高将影响块状元素的高度，因为块状元素将垂直延伸直到达到父元素的边界或遇到另一个块状元素。

因此，在给定的代码片段中，将<span>元素设置为块状元素后，它将占据外层盒子的整个高度（300px）。