HTML允许`<a>`标记内的内容

Question

我很难决定使用哪个似乎都有效。

我应该在<a>元素中放置<h2>链接吗？

或者反过来？

什么是正确的标准？

Answer 1

如果您正在使用HTML allows any other elements within <a> elements，则只能在<h2>元素中放置<a>个元素。之前的规范（或者你想要查看它们的当前规范）从未允许这样做。

通常的做法是将<a>放在<h2>中。这有效，并且一直有效，并且是HTML5之前唯一有效的方法，用于标题链接，因为链接引用该标题中的文本。您很少需要在<h2>中放置<a>，除非<h2>是一个更复杂的结构的一部分，该结构充当整个超链接。

Answer 2

它的功能也不相同，有一个很大的区别。

如果您将<h2>放入<a>，标题的整个块（例如行）将像链接一样工作。

但是，如果您将<a>放入<h2>，则只有可见文字才能用作链接。（你可以用光标改变来测试它）

Answer 3

<h2>是块级别而<a>不是，因此<h2>可以包含<a>，但不能反过来

Answer 4

答案是，这取决于......

从W3C网站，更具体地来说，在HTML5 semantics page中，很明显h2元素（与所有其他标题标签一样）具有内容模型“Phrasing content”。

现在，在Phrasing content link之后，您将获得以下说明：

短语内容是文档的文本，以及元素在段落内标记该文本。短语的运行内容形式段落。

在以下列表中，您的短语内容包括：

a（如果它只包含措辞内容）

因此，如果a标记仅包含短语内容，则HTML5允许其包含在h2标记内。

Viceversa，text level semantics page描述了a元素内容模型，如下所示：

透明，但必须没有互动内容后代。

在Transparent link之后，在说明的最后找到以下内容：

当透明元素没有父元素时，则表示其内容的一部分必须将“透明”的模型视为接受任何模型流程内容。

可以使用此元素的上下文：在哪里有流量内容。

h2标记可以被视为流内容。

因此，如果a标记没有父标记，则在HTML5中必须将其视为接受任何流内容，包括h2标记。

Answer 5

我有这个......

<header>
  <a href="/home">
    <h1>Main heading</h1>
    <h2>Sub heading</h2>
  </a>
</header>

它对我有用。

包括子标题在内的整个标题文本可以随意点击。我不知道用html 5做更好的方法。

Answer 6

W3C specs for h2表示其允许的父元素是任何可以包含流元素或hgroup的元素。 specs for a允许包含短语或流元素的父元素。 h2可以包含短语内容，并且可以包含短语或流内容，因此根据规范，任何一个都是允许的。

由于你包含了语义标记，我假设你对哪个'似乎'更好感兴趣。就我而言，因为我想不出什么时候我想要一个锚点来覆盖标题和其他内容，但我可以想到很多时候标题应该包含一个锚点和其他内容，内部h2似乎是最好的路线。

HTML允许<a>标记内的内容