什么应该放在 HTML 中,锚点或标题? [复制]

Posted

技术标签:

【中文标题】什么应该放在 HTML 中,锚点或标题? [复制]【英文标题】:What should come first in HTML, an anchor or a header? [duplicate] 【发布时间】:2011-07-17 12:30:08 【问题描述】:

我想知道以下两个命令中哪一个在 html 中是语义正确的:

1. <h1><a>Header</a></h1>
2. <a><h1>Header</h1></a>

【问题讨论】:

【参考方案1】:

我会说&lt;h1&gt;&lt;a&gt;,因为&lt;h*&gt; 是块元素,&lt;a&gt; 是内联元素,所以将内联元素保留在 div 块内似乎更自然,而不是反过来。

【讨论】:

【参考方案2】:

在我看来,标题应该是第一位的,但我怀疑搜索引擎是否真的会介意它们是什么方式,在 H1 内部对我来说似乎更干净......

【讨论】:

【参考方案3】:
<h1><a>Header</a></h1>

&lt;h1&gt; 是块级元素,&lt;a&gt; 不是,在语法上无效的 HTML 在内联元素中包含块级元素(至少在 HTML5 之前),而另一种方式就是这样。

【讨论】:

任何在我发表评论时阅读本文的人都应该知道 HTML5 中的任何一个都是可以接受的。来源:webmasters.stackexchange.com/questions/20446/…【参考方案4】:

由于 h1 不直接对应于可视对象,因此它们都是正确的。

【讨论】:

【参考方案5】:

从语义的角度来看:两者都(或两者都不是)。

(从结构的角度来看,OTOH,在 HTML 5 之前,锚 不能 包含标题,并且由于浏览器并非全部支持 HTML 5,但您应该尽可能避免使用新形式的构造)

如果您正在创建链接目标,那么无论如何&lt;h1 id="target_name"&gt;&lt;h1&gt;&lt;a name="target_name"&gt; 更受欢迎。

如果您正在创建一个超链接,那么从语义的角度来看,将最重要的标题放在页面链接的其他位置有点可疑。

【讨论】:

“因为浏览器并非全部支持 HTML 5,但您应该尽可能避免使用新形式的构造”——这不就是 HTML5 规范已经编纂现有文档类型的领域之一吗?浏览器行为,这意味着您可以在任何地方愉快地使用此构造? 我已经看到浏览器破坏了锚点内的块元素。不过,我还没有深入检查这是在什么情况下。【参考方案6】:

这个重复问题的答案比我的要好:https://***.com/a/7023551/20578

但是,为了后代:


在语义上,没有区别。请记住,“语义”只是意味着“与意义相关”,而意义只是人类之间达成一致的东西(因为计算机本身并不具有意义,这是人脑的事情)。没有人有时间同意这些几乎相同的选项中的一个意味着与另一个不同的东西:)

令人惊讶的是,就当前的 HTML 规范而言,它们实际上也是有效的,因为 &lt;a&gt; 的内容模型被定义为“transparent”,即与其父级相同。

见:

http://www.pauldwaite.co.uk/test-pages/5341451

还有:

http://html5.validator.nu/?doc=http%3A%2F%2Fwww.pauldwaite.co.uk%2Ftest-pages%2F5341451%2F&showsource=yes

(假设&lt;a&gt; 的父级可以有一个&lt;h1&gt; 作为其子级)

但是,它在以前的 HTML 版本下无效:

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.pauldwaite.co.uk%2Ftest-pages%2F5341451&charset=%28detect+automatically%29&doctype=HTML+4.01+Transitional&group=0

【讨论】:

以上是关于什么应该放在 HTML 中,锚点或标题? [复制]的主要内容,如果未能解决你的问题,请参考以下文章

React SPA 中的锚点或按钮?

css 通过css禁用锚点或按钮

将按钮放在锚点内有啥缺点吗?

“href”代表啥? [复制]

href与src 区别

我们应该把 <input> 放在 <label> 里面吗? [复制]