为什么这个HTML不起作用？

Question

我在段落中有一个span文本块。在这个跨度块中，我有两个段落。在webkit上，浏览器正确呈现第一段，但在最后两段上失败回到浏览器默认设置。为什么呢？

<style type="text/css">

span.post-content {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
}

</style>

<p><span class="post-content"> Some text here <p/> From here text loses style and adopts browser default <p/> same here </span></p>

这适用于所有浏览器，除了基于Webkit的浏览器：chrome和safari。

Answer 1

示例是invalid。修复错误，问题可能会消失。

1. span元素不能包含p元素
2. 在HTML <p/>中并不代表您可能认为的含义
HTML兼容XHTML中不允许
3. <p/>
4. 在XHTML中，<p>可能不包含<p>（也不在HTML中，但结束标记是可选的，因此<p>foo<p>bar有效且意味着<p>foo</p><p>bar）

你可能想要这样的东西（并改变CSS以引用改变的元素类型）

<div class="post-content">
    <p>Some text here</p>
    <p>From here text loses style and adopts browser default</p>
    <p>same here</p>
</div>

Answer 2

也许您可以从编写结构良好的HTML开始，然后查看是否存在任何问题。

Answer 3

您可以随时在此处检查您的（X）HTML代码：

validator.w3.org

或者在Opera浏览器中更快：右键单击 - ＆gt;验证

Answer 4

正如David所说：span不能包含p - 它可以 - 但它没有意义 - 因为span是INLINE显示类型而p是BLOCK类型。 span元素是块中的一行......

正如本所说：概念必须被理解 - 结构化与否