我应该将<i>嵌套在<a>内还是将<a>嵌套在<i>内？

Question

我是一个锚点标签，超链接中显示的文本应该是斜体。在使用锚点时，我应该在文本本身上使用斜体标记还是将整个锚点标签变为斜体？哪种写法是正确的语法？

示例：

<a href="http://www.google.com/"><i>Google</i></a>

或者：

<i><a href="http://www.google.com/">Google</a></i>

- Kevin Andrew Fogg

---

可能是“Is it right to add <span> tag inside <a> tag?”的重复内容。 - bejado

我没有研究那个，因为我认为那不是我要找的东西。我会阅读的。谢谢，@bejado。 - Kevin Andrew Fogg

@bejado 不是重复问题 - 那个问题是在2011年提出的。HTML5已经改变了很多东西。 - Leland

@bejado HTML5发生了巨大的变化。在HTML5中，块级元素和内联元素已经消失，被更广泛的称为内容模型的类别所取代，这些模型规定了哪些元素可以包含哪些元素。 - Andrew Li

Answer 1

两种写法都是完全有效的。请参见 HTML5 规范，其中解释了这些标签的语义和用法。在 a 元素 中：

4.5.1 a 元素

[...]

可使用此元素的上下文

  期望使用 语气内容 的地方。

元素可用的上下文是元素有效且可以使用的地方¹。在规范中，语气内容被定义为：

Phrasing content is the text of the document, as well as elements that mark up that text at the intra-paragraph level. Runs of phrasing content form paragraphs.

a abbr area (if it is a descendant of a map element) audio b bdi bdo br button canvas cite
code data datalist del dfn em embed i iframe img input ins kbd keygen label map mark 
math meter noscript object output progress q ruby s samp script select small span strong 
sub sup svg template textarea time u var video wbr text

因此，短语内容意味着文档的文本或标记文本的元素，例如用于超链接的a或用于斜体的i。上述任何元素都适用。如果您查看i元素：

4.5.17 i元素

[...]

可以使用该元素的上下文

  希望使用短语内容的地方。

从规范中可以看出，a和i可以在相同的上下文中使用，即短语上下文。因此，我们可以得出结论：

• 在i元素内部使用a元素是可以的，因为a元素可以用于短语内容。由于i是短语内容，因此它是有效的。
• 在a元素内部使用i元素是可以的，因为a元素可以用于短语内容。由于a是短语内容，因此它是有效的²。

在有效性方面，您可以任选一种方式，没有哪种更有效。

---

¹通常可以确定元素是否为块级或内联，但HTML5已经删除了这些类型，而采用了更多描述性的类别，请在MDN上了解更多信息。 ²请注意，即使a是短语内容，您也不能将一个a嵌套在另一个a中。这是因为a的内容模型不支持交互式内容。对于其他元素可能适用其他限制。

- Andrew Li

---

由于回答完整，被选为最佳答案。 - Kevin Andrew Fogg

Answer 2

两者都是有效的。我个人会使用：

<a href="http://www.google.com/"><i>Google</i></a>

这是因为这意味着 <a> 标签中的文本是特殊的。

- Cassidy

---

你的意思基本上是这是一个偏好的事情？这正是我想到的。谢谢！ - Kevin Andrew Fogg

@KevinAndrewFogg 有点像。这更多是一个上下文的问题，而不是其他什么。同样，如果你想强调链接内的文本，那么它应该得到那个标签。如果一些链接很特别，而另一些则不是（无论文本如何），那么你可能想在<a>标签周围加上<i>标签。 - Cassidy