将h3嵌入锚点 - 这是如何有效的？

Question

<li class="vcard">
  <a class="url" href="/about/us/">
    <img class="photo" alt="some" src="/img/nicething.png">
    <h3>hello</h3>
  </a>
  <p class="role meta">Something here</p>
</li>

我已经看过这段代码,我已经过验证,它在w3c HTML5验证中返回VALID.

我很坚强,我们h3内心也没有anchor.

如果我们display:block;成为主播,这似乎变得有效了？

Answer 1

如果您查看HTML5规范,<a>标签上有一个部分:

a只要在其中没有交互式内容(例如按钮或其他链接),该元素可以围绕整个段落,列表,表格等,甚至整个部分.

我在HTML4规范中找不到任何说明将块级标签放在内联级标签内的内容无效,但我确实记得在某处读它.

Answer 2

它在HTML5中声明有效,因为它对元素的定义a具有"透明"内容模型.因此,当a元素出现在h3允许的上下文中时,则a允许h3元素包含元素.

这与HTML 4.01规范不同,其中允许a元素仅具有"内联"内容(例如,没有标题).以前的所有HTML规范都采用相同的立场.

但是,浏览器实际上也允许您嵌入h3内部a,因此HTML5实际上只是回应浏览器实践.但请注意,存在功能差异:您可以通过单击标题文本右侧的某些点来查看此信息.(原因是如果你嵌入h3内部a,链接将获取完整的可用宽度,延伸到文本之外.)

任何CSS设置都无关紧要.HTML有效性不依赖于它们,甚至不依赖于CSS的存在.