哪一个更正确：<h1> <a> … </a> </ h1>或<a> <h1> … </ h1> </a>
既有<h1><a ...> ... </a></h1>和<a ...><h1> ... </h1></a>有效的HTML，或者只有一个正确？ 如果他们都是正确的，他们的意思是不同的？
我正在更新这个答案，因为旧的答案有点不正确。
正确的答案是两个版本都是正确的。 它们之间最大的区别是，在<h1><a>..</a></h1>的情况下，只有标题中的文本可以点击。
如果将<a>放在<h1>周围，并且CSS display属性是block （默认情况下），则整个块（ <h1>的高度和容器宽度的100％ <h1>居住在）将是可点击的。
从历史上看，你不能将一个块元素放在一个内联元素中，但HTML5不再是这种情况。 我会认为<h1><a>..</a></h1>方法更传统。
如果你想在标题上加一个锚点，比<a id="my-anchor"><h1>..</h1></a>更好的方法是使用id或者name属性如下： <h1 id="my-anchor">..</h1>或<h1 name="my-anchor">..</h1>
在这之前的HTML 5中
<a><h1>..</h1></a>
将不会validation。 你可以在HTML 5中使用它。但是，我会使用这个：
<h1><a>..</a></h1>
除非你需要在<a>中添加<h1>以上的内容
<a><h1></h1></a>不是W3C有效的…基本上，你不能把块元素放入内联元素
当样式表不影响渲染时， <h1><a>..</a></h1>和<a><h1>..</h1></a>总是performance相同。 几乎，但不完全。 如果您使用Tab键导航或以其他方式关注链接，则大多数浏览器的链接都会出现“焦点矩形”。 对于<h1><a>..</a></h1> ，此矩形仅在链接文本的周围。 对于<a><h1>..</h1></a> ，矩形扩展到可用的水平空间，因为标记使得a元素在渲染中成为块元素，默认占据100％的宽度。
以下显示了<a href=foo><h1>link</h1></a>如何呈现重点<a href=foo><h1>link</h1></a> ：
这意味着，如果您通过为链接设置背景颜色来设置元素的风格，则效果也会以类似的方式不同。
从历史上看， <a><h1>..</h1></a>在HTML 2.0中被宣布为无效，随后的HTML规范也随之而来，但是HTML5改变了这一点，并声明它是有效的。 正式的定义并没有影响浏览器，只有validation者。 然而，某些用户代理（可能不是普通的浏览器，但是例如专门的HTML渲染器，数据提取器，转换器等）无法正确处理<a><h1>..</h1></a> ，因为在规范中没有被允许。
在标题链接中很less有很好的理由来标题或文本。 （这大部分是不合逻辑的，而且可用性很差。）但是，当使标题（或标题中的文本）成为链接的潜在目的地时，经常出现类似的问题，例如使用<h2><a name=foo>...</a></h2>与<a name=foo><h2>...</h2></a> 。 类似的考虑适用于这个（这两个工作，可能有一个区别，因为后者使a元素块，并在HTML5之前，只有前者是正式允许的）。 但是另外，两种方法都过时了，现在推荐在标题元素上直接使用id属性： <h2 id=foo>...</h2> 。
H1元素是块级元素，锚是内联元素。 您可以在块级元素中使用内联元素，但不能使用其他方法。 当你考虑盒子模型和HTML规范时，这是有道理的。
所以最后的结论是：
<h1><a href="#">Link</a></h1>
你想使用超链接<a href="…"> / a:link ，或者你想添加一个锚点到你的标题？ 如果你想添加一个锚，你可以简单地分配一个id <h1 id="heading"> 。 您可以将其链接为page.htm#heading 。
如果要使标题可点击（链接），请首先使用<h1><a></a></h1> / h1 > a – blocklevel元素，并将内联元素
另外，还有风格等级差异。 如果您将其作为<h1><a href="#">Heading here</a></h1> ，那么锚的样式将取代h1元素的样式。 例：
a {color:red;font-size:30px;line-height:30px;}
将超越
h1 {color:blue;font-size:40px;line-height:40px;}
