范围内没有 p 元素，但看到了一个 p 结束标记。w3c 验证答案

【问题标题】：No p element in scope but a p end tag seen.w3c validation范围内没有 p 元素，但看到了一个 p 结束标记。w3c 验证
【发布时间】：2014-01-31 19:40:45
【问题描述】：

我的 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>

【问题讨论】：

标签： html w3c-validation html-validation

【解决方案1】：

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

<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 - Reference}

【讨论】：

我使用 wordpress 并在我在编辑器中创建 div 时自动添加它
@user2500837 虽然它不应该这样做，但如果这样做，则将编辑器模式切换为代码并将其删除，否则，在运行时使用 jQuery/JavaScript 将其删除
感谢您的解释！我以为我快疯了，因为我知道 是一个块元素。所以我假设它可以包含块元素。

【解决方案2】：

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

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

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

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

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

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

【讨论】：

【解决方案3】：

您不能在语义上将 div 放入  标记内。

【讨论】：