53

我的 HTML 如下所示。我打开了所有元素并关闭了它们。当我在 w3c 上检查它时仍然显示错误。我想不通。 

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Untitled Document</title>
    </head>

    <body>
        <p>
            <div class="inr_content clearfix">
                 <div class="col2 first fl">
                      to provide a drive-in services.
                 </div>
                 <div class="col2 last fr">
                      to provide a drive-in services.
                 </div>
            </div>
        </p>
    </body>
</html>
4

3 回答 3

67

那是因为您在标签内嵌套了一个p无效的块级元素。您只能嵌套内联元素，例如span,a和imginsidep标签。所以你的标记是无效的，考虑做类似的东西

<div class="inr_content clearfix">
   <div class="col2 first fl">
      <p>to provide a drive-in services.</p>
   </div>
   <div class="col2 last fr">
      <p>to provide a drive-in services.</p>
   </div>
</div>

来自 W3C [1]：

P 元素代表一个段落。它不能包含块级元素（包括 P 本身）。

1 -参考

于 2014-01-13T06:05:50.717 回答
4

由于p元素的语法不允许有子元素，并且可以省略div结束标记，因此验证器（和浏览器）在解析元素时会暗示何时遇到标记。也就是说，当被解析（或“打开”）时，元素的开始标签会隐式关闭它，就好像标记有：</p></p><div>ppdiv

<body>
    <p>
        </p><div class="inr_content clearfix">
             <div class="col2 first fl">

这意味着有一个p元素中只有空格。之后出现的</p>标签因此没有匹配的开始标签，并被报告为无效。浏览器会忽略这种无家可归的结束标签，但验证者必须报告它们。

最小的变化是删除</p>标签。这是否足够取决于您想要什么。删除<p>标签也会删除p元素，这会影响渲染。即使p元素没有渲染内容（内容高度为 0），它也有默认的顶部和底部边距，可能会创建一些空白的垂直空间。

如果您不想要这样的空间，只需删除<p>标签（</p>当然还有）。如果你确实想要一些空间，通常最好还是删除标签，但是你会在 CSS 中另外设置margin-top顶级div元素的一些合适的值。

即使pHTML5 中允许只包含空格的元素，也不推荐使用它们。这是与所谓的可触内容有关的一般建议的一部分：“其内容模型允许任何流动内容或短语内容的元素应在其内容中至少有一个节点是可触内容”。文本通常是明显的内容，但如果它仅包含空格则不是。

于 2014-01-13T11:14:11.257 回答
1

您不能在语义上将 div 放在<p>标签内。

于 2014-01-13T06:06:21.827 回答