Question

如果您在现代浏览器（Chrome，Firefox或IE的最新稳定版本）中查看this page，您会看到文字大小增加。看一下源代码，似乎是由于代码中未关闭的<h3>。

但是，我记得大多数浏览器只要有机会就会自动关闭标签。以下代码（与损坏的站点相同的doctype）适用于所有标记关闭：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html>
  <head></head>
  <body>Hello
    <h3>My
    <h3>Name
    <h3>Is
    <h3>Manish
  </body>
</html>

所以未公开的<h3>可能不是（或可能只是其中一部分）问题。

所以，我的问题是，为什么浏览器不会在那里自动关闭标签？

Answer 1

首先，h1到h6元素始终需要开始和结束标记才能验证，even back in HTML 3.2：

H1，H2，H3，H4，H5和H6用于文档标题。您始终需要开始和结束标记。

因此，链接中的页面和您的示例都无效。

也就是说，浏览器如何以不同方式处理这两种情况很有意思（是的，未封闭的<h3>标签是问题）：

在任何HTML DOM中，h1到h6元素永远不会是彼此的子元素，类似于p元素永远不会是彼此的子元素。任何此类未关闭的开始标记后面的任何开始<h1>到<h6>标记都会隐式关闭它，然后只有。因此，示例中的所有h3元素都是彼此的兄弟，而不是连续的后代。

但该页面中发生的事情是，h3元素根本不是彼此的兄弟姐妹。相反，它们全部由表格单元格，font元素分隔，依此类推。这非常混乱（尽管可能需要使用Microsoft FrontPage ¹创作的页面。）

但是，虽然<tr>和<td>标记有自己的结束标记，但这不会导致它们之间的<h3>标记隐式关闭。他们还是开着的！由于<h3>标记都没有关闭且中间<font>和其他标记与h3元素发生冲突，因此h3元素包含以下所有标记作为后代，但不是直接作为孩子，尽管 <tr>和<td>元素：

h3
  font
    font
      ...
        h3
         font
           font
             ...

结果，字体大小随着每个连续的h3递增，然后发生相当大的（ha！）灾难。请注意，font元素无关紧要，因为它们都没有定义size属性。

这一切的主要内容是什么？

验证您的freakin'标记。² 特别是，关闭所有的freakin'标签（除非关闭标签被禁止）。< / p>

虽然页面和您的示例使用HTML 3.2 doctype，它触发了怪癖模式，但应该注意这种行为在怪癖模式和标准模式下都是一致的。实际上，HTML5规范包含一个完全专用于parsing和DOM tree construction的部分，以便针对无效标记设置各种浏览器行为（为了与传统标记兼容）。即使在标准模式下，浏览器也应遵循此规范，因此在大多数浏览器中，两种模式的行为都是一致的。

在一个小节中包含有关如何处理这种特定情况的规则：

标签名称为以下之一的开始标记：“h1”，“h2”，“h3”，“h4”，“h5”，“h6”

如果打开元素的堆栈在按钮范围内有p元素，那么就好像看到了标记名为“p”的结束标记。

如果当前节点是标签名称为“h1”，“h2”，“h3”，“h4”，“h5”或“h6”之一的元素，那么这是一个解析错误;将当前节点从打开的元素堆栈中弹出。

为令牌插入HTML元素。

这意味着如果解析器仅在当前处于打开的标题元素中时遇到标题标记，则抛出解析错误并且应该在输入此新标题元素之前关闭先前打开的标题元素，这就是发生的情况。你的榜样。否则，没有什么特别的事情发生（即解析器应该像往常一样继续）。

那就是说，请不要依赖这个。解析错误仍然是错误;对解析器很好，不要因为你可以抛出错误。只需编写有效的代码，你就可以了。当然，即使在您验证了代码之后浏览器仍然陷入困境，您也可以担心。

¹ _{顺便说一下，我的第一个HTML编辑器......我才9岁。}

² _{不要过度，但也不要忽视这样做。}

Answer 2

只有<p>或<li>等特定标签才会自动关闭。 <hN>代码不是。

（另外，为了将来参考，如果某个网站在两个以上的现代浏览器中被破坏，问题不在于浏览器或规格，通常是网站）。

无效纠正者可以做多少惩罚是有限度的。由于<font>元素是内联的（即使无效），并且<h3>不是直接后代（它不被识别为“兄弟”），因此没有理由关闭{{1}在这些元素之外，它们包含在。

中

Answer 3

您始终需要关闭标题标记。根据我的经验，关闭p和li标签也很好，尽管通常无关紧要。关于编码是最好尽可能具体。您不希望浏览器尝试猜测任何内容，因此请具体。

为什么unclosed H3标签打破了这个页面？

3 个答案: