将块级元素(如p )直接嵌套在内联元素(如b) 中是无效的。
然而，使用诸如display: inline-block或position: absolute之类的css在概念上可以在内联上下文中具有块级内容。
浏览器在很大程度上接受内联元素中的这种块级元素，但在某些情况下，无效结构会导致实际问题:
<p><span><p></p></span></p>
上面的示例将而不是解析为三个嵌套元素;最里面的<p>会隐式地关闭外面的<p>，而不管CSS是什么。你可以看到一个jsbin的演示。
是否有一些方法使用中间元素来有效地将块级元素放置在内联元素中?
如果这是不可能的，是否有一个无效的，但功能的解决方案，为大多数情况下(最好也为棘手的<p>标签)?
要清楚，我正在寻找一个通用的解决方案，不需要侵入性地改变文档结构(即。"在任何地方使用span"并不是一个有吸引力的解决方案)。我想嵌入一个未知的(动态生成的)文档片段与潜在的块级内容-所以固定片段以排除块级元素是不可行的。
相关:(主要解决直接嵌套的有效性)
- 是错误的改变一个块元素与CSS内联，如果它包含另一个块元素?
- 内联元素中的块级元素
- 块级元素允许内联级元素在HTML5?
W3C验证器(在XHTML模式下)列出以下在<span>和<p>之间有效的元素:
- ins
- 。
- <
- 按钮/gh>
使用这些工具作为内联到块生成工具的页面在XHTML Strict中验证，但在HTML 5中不验证。在这些标签中，我倾向于object，因为它具有最少的语义包袱。
HTML 5似乎已经放弃了内联与块的区别，而支持一个更复杂的系统，在这个系统中，元素有几个不同的类别，一个元素可以有哪些子元素取决于它的祖先是什么。在这些元素中，ins、del和map现在接受与其父元素接受的相同类型的子元素，而button只接受"短语内容"(最接近内联元素)。object的错误信息没有多大意义，但据我所知，它继承了父元素的限制，同时也施加了一些自己的限制。
据我所知，一旦你在其中(除了iframe和新文档)，就没有办法逃避措辞内容，所以这个问题的答案是否定的，不能在HTML5中完成(截至撰写本文)。
语义是错误的，我认为HTML5允许块元素在<仅a>标签(据我所知)。
换句话说，你可以让你的html代码工作，你想通过改变css，但这并不意味着你的html代码是正确的。您还应该考虑可能出现的SEO和可访问性问题。