什么是使文本变为斜体的正确方法？我已经看到以下四种方法：

<i>Italic Text</i>

<em>Italic Text</em>

<span class="italic">Italic Text</span>

<span class="footnote">Italic Text</span>

<i>

这是“老办法”。<i>没有语义含义，仅传达使文本变为斜体的表示效果。据我所知，这显然是错误的，因为这是非语义的。

<em>

这仅出于表达目的而使用语义标记。碰巧<em>默认情况下会以斜体显示文本，因此那些意识到<i>应避免但不知道其语义含义的人经常使用它。并不是所有的斜体文本都是斜体的，因为它是强调的。有时，它可能恰好相反，例如旁注或耳语。

<span class="italic">

这使用CSS类放置演示文稿。这经常被吹捧为正确的方法，但是对我来说，这似乎又是错误的。这似乎并没有传达出更多的语义含义<i>。但是，它的支持者大声疾呼，如果您说想要大胆的话，以后更改所有斜体文本要容易得多。事实并非如此，因为那时我将剩下一个称为“斜体”的类，该类使文本变为粗体。此外，目前尚不清楚为什么我要更改我网站上的所有斜体文本，或者至少我们可以想到这种情况是不希望或没有必要的。

<span class="footnote">

这将CSS类用于语义。到目前为止，这似乎是最好的方法，但实际上存在两个问题。

1. 并非所有文本都有足够的含义来保证语义标记。例如，页面底部的斜体文本真的是脚注吗？还是放在一边？或完全其他的东西。也许它没有特殊的含义，只需要用斜体将其表示形式与前面的文本分开即可。

2. 如果没有足够的强度，语义可能会发生变化。可以说，我跟着“脚注”是基于页面底部的文字。如果几个月后我想在底部添加更多文本，会发生什么？它不再是脚注。我们该如何选择一个语义类，该语义类的通用性要小于<em>但避免了这些问题？

摘要

似乎在许多情况下，对语义的要求似乎过于繁重，在这些情况下，使斜体字的意图并不意味着带有语义。

此外，将样式从结构中分离出来的愿望导致CSS被吹捧为<i>在某些情况下实际上用处不大的替代品。因此，这让我留下了谦卑的<i>标签，并且想知道这种思路是否是将其保留在HTML5规范中的原因？

是否有关于此主题的好的博客文章或文章？可能是由那些决定保留/创建<i>标签的人员参与的？

您应针对不同的用例使用不同的方法：

1. 如果要强调短语，请使用<em>。
2. 该<i>标签具有在HTML5新的含义，代表“一个在可替代的语音或文本心情跨度”。因此，您应该将此标签用于思想/辅助或惯用语。该规范还建议了船名（但不再建议书名/歌曲名/电影名；<cite>而是使用该名称）。
3. 如果斜体文本是较大上下文的一部分（例如，介绍性段落），则应将CSS样式附加到较大元素，即 p.intro { font-style: italic; }

<i>没错，因为它是非语义的。这是错误的（通常），因为它只是陈述性的。关注点分离意味着演示信息应与CSS一起传达。

一般而言，正确命名可能很棘手，类名也不例外，但这是您必须要做的。如果您使用斜体使块从正文文本中脱颖而出，则可能会按顺序使用“ flow-distinctive”类名。考虑重用：类名用于分类-您还要在其他地方做同样的事情吗？这样可以帮助您确定一个合适的名称。

<i>包含在HTML5中，但具有特定的语义。如果您将某件商品标记为斜体的原因符合规范中确定的语义之一，则应该使用<i>。否则不行。

我不是专家，但我想说的是，如果您真的想成为语义，则应该使用词汇表（RDFa）。

这应该导致如下结果：

<em property="italic" href="http://url/to/a/definition_of_italic"> Your text </em>

em用于表示（人类将以斜体显​​示），propertyand href属性链接到斜体的定义（对于机器）。

您应该检查这种词汇是否存在，也许属性已经存在。

有关RDFa的更多信息，请访问：http : //www.alistapart.com/articles/introduction-to-rdfa/

TLDR

使文本变为斜体的正确方法是忽略该问题，直到您到达CSS，然后根据表示语义进行样式设置。根据情况，您提供的前两个选项可能是正确的。最后两个是错误的。

更长的解释

编写标记时不必担心呈现。不要以斜体字思考。从语义上考虑。如果需要强调压力，则为em。如果与主要内容相切，则为aside。也许会大胆，也许会斜体，也许会是荧光绿。编写标记的时间无关紧要。

当您接触到CSS时，可能已经有了一个语义元素，可以将斜体字显示在网站中的所有内容都有意义。em是一个很好的例子。但是，也许您希望所有内容都aside > ul > li以斜体显示。您必须将对标记的考虑与对演示的考虑分开。

如DisgruntledGoat所述，iHTML5中是语义。不过，语义对我来说似乎有点狭窄。使用可能很少见。

emHTML5中的语义已更改，以强调重点。strong也可以用来显示重要性。strong如果您要为其设置样式，则可以使用斜体而不是粗体。不要让浏览器的样式表限制您。您甚至可以使用重置样式表来帮助您停止思考默认值。（尽管有一些警告。）

class="italic"不好。不要使用它。它不是语义的，也不是完全灵活的。表示仍然具有语义，只是与标记不同。

class="footnote"正在模仿标记语义，并且也是错误的。脚注的CSS不应完全不同于脚注。如果每个部分的样式都不同，则您的网站将显得过于混乱。您应该在页面上散布一些视觉模式，然后将其转变为CSS类。如果脚注和块引用的样式非常相似，则应将相似之处放在一类中，而不是一遍又一遍地重复。您可以考虑采用OOCSS的做法（下面的链接）。

在HTML5中，关注点和语义的分离很大。人们常常没有意识到标记并不是语义重要的唯一地方。有内容语义（HTML），但也有表示语义（CSS）和行为语义（JavaScript）。它们都有各自独立的语义，这对于注意可维护性和保持DRY至关重要。

OOCSS资源

• 面向对象的CSS
• 面向对象CSS（OOCSS）简介
• 如何编写面向对象的CSS
• 面向对象CSS（OOCSS）入门
• 面向对象的CSS：什么，如何以及为什么
• 深入面向对象的CSS

也许它没有特殊的含义，只需要用斜体将其表示形式与前面的文本分开即可。

如果它没有特殊含义，为什么需要从表述上将其与前面的文本分开？这段文字看起来有些怪异，因为我无缘无故地将其斜体了。

不过，我同意你的观点。设计师制作视觉上变化而又没有有意义变化的设计并不少见。我经常在盒子上看到这种情况：设计师会为我们提供设计，包括带有颜色，角，渐变和阴影的各种组合的盒子，而样式和内容的含义之间没有任何关系。

因为这些都是在不同的地方重复使用相当复杂的样式（与有关Internet Explorer的问题），我们创建类，如box-1，box-2，使我们可以重新使用的样式。

但是，使某些文本为斜体的特定示例太琐碎，不必担心。最好将这些细节留给语义纳特尔争论。

HTML斜体文本以斜体格式显示文本。

<i>HTML italic text example</i>

重点和强项都可以用来增加某些单词或句子的重要性。

<p>This is <em>emphasized </em> text format <em>example</em></p>

当您想强调文本中的一点时，应该使用强调标签，而不必在斜体文本时使用它。

有关更多信息，请参见本指南：HTML文本格式

所述i元件是非语义，所以对于屏幕阅读器，Googlebot的，等等，应该是某种透明（就像span或div元件）。但这对开发人员来说不是一个好选择，因为它会将表示层与结构层连接在一起-这是一个不好的做法。

em元素（strong也）应始终在语义上下文中使用，而不是表示形式。只要某些单词或句子很重要，就必须使用它。仅以上一句话为例，我应该em更强调“应始终使用”部分。浏览器为这些元素提供了一些默认的CSS属性，但是您可以并且应该重写默认值（如果您的设计需要这样做）以保留这些元素的正确语义。

<span class="italic">Italic Text</span>是最错误的方法。首先，它不方便使用。其次，它建议案文应为斜体。而结构层（HTML，XML等）不应该好高骛远了。演示文稿应始终与结构分开。

<span class="footnote">Italic Text</span>似乎是脚注的最佳方式。它不建议任何演示，而仅描述标记。您无法预测功能会发生什么。如果功能中的脚注会变大，则可能会迫使您更改其类名（以在代码中保留一些逻辑）。

因此，只要您有一些重要的文字，就可以使用em或strong加以强调。但是请记住，这些元素是内联元素，不应用于强调大块文本。

如果只在乎外观，请使用CSS，并始终尝试避免任何额外的标记。

我认为答案是<em>在您打算强调时使用。

如果在自己朗读文本时发现使用略微不同的声音来强调一点，则应该使用该声音，<em>因为您希望屏幕阅读器执行相同的操作。

如果它纯粹是一种样式，例如您的设计师认为所有<h2>标题都以斜体Garamond看起来更好，则没有语义上的理由将其包含在HTML中，您只需更改CSS即可使用适当的元素。

我看不出有任何使用理由<i>，除非您特别需要支持某些没有CSS的旧版浏览器。

我会说<em>用来强调内联元素。将类用于块元素，例如文本块。是否使用CSS，仍然需要标记文本。无论是用于语义还是用于视觉辅助，我都假设您将其用于有意义的事情...

如果出于任何原因强调文本，则可以使用<em>，或使用斜体显示文本的类。

有时可以违反规则！

好，首先要注意的是 <i> 已被弃用，不应使用 <i>尚未弃用，但我仍然不建议您使用它-有关详细信息，请参见注释。这是因为它完全违反了您已经指出的将表示保留在表示层中的问题。同样，<span class="italic">似乎也打破了模具。

因此，现在我们有两种实际的处理方式：<em>和<span class="footnote">。请记住，这em代表强调。当您希望对单词，短语或句子进行强调时，<em>无论是否要使用斜体，都应将其粘贴在标签中。如果你想改变造型在一些其他的方式，使用CSS： em { font-weight: bold; font-style: normal; }。当然，您也可以将一个类应用于<em>标签：如果您决定要使某些强调的短语以红色显示，请给它们一个类并将其添加到CSS中：

Fancy some <em class="special">shiny</em> text?

em { font-weight: bold; font-style: normal; }
em.special { color: red; }

如果出于其他原因应用斜体，请使用其他方法并为该部分提供一个类。这样，您可以随时更改样式，而无需调整HTML。在您的示例中，不应强调脚注-实际上，应该不加强调，因为脚注的目的是显示不重要但有趣或有用的信息。在这种情况下，最好将一个类应用于脚注，并使它看起来像表示层中的CSS一样。

如果您需要一些斜体字而不包含其他样式的内容，请使用<em>。它还有助于使内容具有语义。

text-style 更适合多种样式，无需语义。

做

1. 给class属性一个值，该值指示数据的性质（即class="footnote"良好）

2. 为页面创建CSS样式表

3. 定义附加到您分配给元素的类的CSS样式

   .footnote { font-style:italic; }

不要

1. 请勿使用<i>或<em>元素-它们不受支持并且将数据和演示文稿联系得太紧了。
2. 不要给该类一个表示演示规则的值（即，不要使用class="italic"）。