CSS/HTML中正确使文本斜体的办法有哪些?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (3)
  • 关注 (0)
  • 查看 (158)

我看到了以下四种方法:

<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>标签和怀疑这一思路是否是为什么它留在HTML 5规范?

有没有关于这个主题的好的博客文章或文章?可能是参与保留/创建<i>标签?

提问于
用户回答回答于

我不是专家,但我想说,如果你真的想成为语义,你应该使用词汇表(RDFa)。

这样做的结果应该是:

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

em用于表示(人们将看到它的斜体),property and href属性链接到斜体的定义(用于机器)。

你应该检查一下是否有这样的词汇表,也许属性已经存在了。

有关RDFa的更多信息,请在这里:http://www.alistpart.com/documents/Introduction to-rdfa/

用户回答回答于

<i>并不是因为它是非语义的。这是错误的(通常),因为它是表现性的。关注的分离意味着预先的信息应该用CSS传递。

命名通常是很棘手的,类名也不例外,但这是你必须做的。如果您使用斜体来使块突出于正文文本,那么可能会有一个名为“flow-分别”的类名。考虑一下重用:类名是用于分类的--您还想在哪里做同样的事情呢?这应该能帮你找到一个合适的名字。

<i>包含在HTML 5中,但给出了特定的语义。如果你将某项标记为斜体符合规范中所标识的语义之一的原因,则使用它是合适的。<i>否则就不会了。

用户回答回答于

对于不同的用例,你应该使用不同的方法:

  1. 如果你想强调一个短语,用<em>...
  2. <i>标签有一个HTML 5的新含义,代表“交替的声音或情绪中的一段文字”。所以,你应该用这个标签来表达一些想法/旁白或习语。该规范还建议船舶名称(但不再建议书/歌/电影名称;使用<cite>)。
  3. 如果斜体文本是较大上下文的一部分,比如一个介绍性段落,那么您应该将CSS样式附加到更大的元素上,即p.intro { font-style: italic; }

扫码关注云+社区

领取腾讯云代金券