内联元素可以包含块元素吗？答案

【问题标题】：Can inline elements contain block elements?内联元素可以包含块元素吗？
【发布时间】：2011-06-22 12:16:45
【问题描述】：

内联元素是否可以包含块元素，例如：列表可以有段落吗？

【问题讨论】：

标签： html

【解决方案1】：

暂且不说 LI 和 P 都是块级的......

这样做是无效的，但在行为方面，有时您可以将块级元素嵌套在内联一级，但这取决于浏览器解析器。

例如，在 FireFox 3.x 中，使用此标记

<!DOCTYPE html>
<i>
   foo
   <div>bar</div>
   baz
</i>

将以斜体显示 foo、bar 和 baz。

但是这个标记，将内联元素 <i> 替换为内联元素 <var>（它也有斜体作为其默认呈现）

<!DOCTYPE html>
<var>
   foo
   <div>bar</div>
   baz
</var>

只会以斜体显示 foo。

其他浏览器的行为不一样。这是您应该坚持使用有效标记的原因之一。

【讨论】：

我知道这是一篇很老的帖子，但 HTML5 确实允许您将标签包裹在几乎任何东西上，包括块级元素。
@user1334007 - 实际上，如果包装元素是 <a> 元素的父元素的子元素并且 <a> 元素是其祖先的有效后代，则它们将是有效的。但另一方面，在 HTML5 中既没有块元素也没有内联元素。 <a> 是短语元素。块和内联是 HTML 4 的概念，并且仍然是 CSS 中的概念，当内联元素包含块元素时，它有自己的规则，但不关心 HTML 内容模型的有效性。

【解决方案2】：

【讨论】：

【解决方案3】：

在内联元素中使用块元素是不正确的标记。如果浏览器和 Doctype 宽松，它仍然可以呈现，但它是无效的。

不过，您可以使用 CSS，如 here 所述。

【讨论】：

【解决方案4】：

如果您希望块元素的行为类似于内联元素，请将 display 属性设置为 inline-block。如果您需要支持 IE 7 或 6，对于您的 IE 样式表中的相同元素，请添加以下两条规则：zoom:1; display:inline。

【讨论】：

【解决方案5】：

内联元素不能包含块元素，块元素可以包含所有种类。您提到的

不是内联元素，它是

的块元素，因此两者都可以相互包含

【讨论】：

【解决方案6】：

块级元素不能从内联级元素继承

Eric Meyer 的书“CSS The dfinitive Guid”第 9 页

【讨论】：

【解决方案7】：

<li> & <p> both are inline elements. so you can use <p> inside <li>

【讨论】：

p 元素是块元素，不是内联元素。但是，它们只能包含内联元素。
LI 不是内联的。 P标签也不是。 LI 允许在其中包含块级内容：htmlhelp.com/reference/html40/block.html。请更新您的答案。
对不起，我弄糊涂了。请原谅我.. 感谢您的分类。