内联元素内放入块级元素会出现什么情况呢？

南北北南

于 2018-08-30 09:57:53 发布

阅读量940

点赞数

分类专栏：前端学习

本文链接：https://blog.csdn.net/c_lam_e/article/details/82216634

版权

本文探讨了内联元素不应嵌套块级元素的规则，并通过实例展示了违反这一规则时的效果。实验结果显示，内联元素中嵌套块级元素会导致选择元素时的范围异常，同时内嵌的块级元素并未按内联方式排列，而是保持了其原有的宽度和独立行显示。

摘要由CSDN通过智能技术生成

我们知道元素可分为块级元素和内联元素，也知道块级元素内既可以嵌套内联元素也可以嵌套块级元素，但是内联元素就只能嵌套内联元素，不可以嵌套块级元素，当然表格下的tr除外，那么如果违反了规定会出现什么样的效果呢？？
代码如下所示

<!--内联元素内嵌套块级元素的展示效果-->
<div>
    这是块级元素
    <div style="width: 200px;height: 200px;background-color: #00bbbb;">这是块级元素</div>
</div>
<span>这是内联元素
    <div style="width: 200px;height: 200px;