在HTML/XHTML中<b>和<strong>, <i>和<em>之间的区别是什么?什么时候使用它们?


当前回答

我们使用<strong>标签的文本有高优先级的SEO目的,如产品名称,公司名称等,而<b>简单使其加粗。

类似地,我们使用<em>表示在SEO中具有高优先级的文本,而使用<i>使文本简单地变成斜体。

其他回答

正如其他人所说,<b>和<i>是显式的(即。"使此文本加粗"),而<strong>和<em>是语义的(即:“应该强调这篇文章”)。

在现代网络浏览器的环境中,很难看出两者的区别(它们似乎产生了相同的结果,对吧?),但想想为视力受损的人设计的屏幕阅读器。如果屏幕阅读器遇到<i>标记,它将不知道该做什么。但是如果它遇到<em>标签,它就知道应该向侦听器强调其中的内容。这就是实际的区别。

<b>和<i>,没有实际的语义意义(就像@splattne指出的那样)是正确的,在很久以前。在现代HTML5 (<!DOCTYPE html>)它们确实有意义。查看以下链接。

语义(来自MDN)

<b>:引起注意元素 摘要中的关键字 产品名称。

<p>Here at company XYZ, we use <b>HTML</b> and <b>Javascript</b>.</p>

<i>: Idiomatic Text元素 不同的声音或情绪 分类学名称(如“智人”属和种) 来自另一种语言的惯用术语(如“等等”) 技术术语

<p>I <i>did</i> tell him, to arrive on time for the meeting.</p>

<b> vs. <strong>

认识到这两者在HTML5中都是有效的语义元素,并且它们在大多数浏览器中都具有相同的默认样式(粗体)可能会有所帮助(尽管一些较老的浏览器实际上下划线<strong>)。每个元素都是在特定类型的场景中使用的,如果你想要加粗文本作为装饰,你应该实际使用CSS font-weight属性。源

<i> vs. <em>

<em>元素表示其内容的重音强调,而<i>元素表示与普通散文分开的文本。源

我的2美分

我个人更喜欢<b>和< I >而不是<strong>和<em>。

它们更短,从开发人员的角度来看,它们的语义也很有意义。 我不知道今天的屏幕阅读器是否能和它们一起工作。如果没有,我想他们最终会的。A18n是一个很难的主题,我只是遵循文档的引导。MDN说我可以用它们,所以我就用了。

B或I表示您希望文本显示为粗体或斜体。Strong或em意味着你希望文本以一种用户理解为“重要”的方式呈现。默认是将strong显示为粗体,em显示为斜体,但一些其他区域性可能使用不同的映射。

就像程序中的字符串一样,b和i将被“硬编码”,而strong和em将被“本地化”。

以下是定义和建议用法的摘要:

< b >…为了功利目的而被吸引注意力的一段文字,没有传达任何额外的重要性,也没有其他声音或情绪的暗示,如文档摘要中的关键词,评论中的产品名称,交互式文本驱动软件中的可操作的单词,或文章导语。

< >强…Now表示重要性,而不是强调。

<我>…以一种不同的语态或语气出现的一段文本,或以一种表明不同文本质量的方式偏离正常的散文,如分类名称、技术术语、来自另一种语言的惯用短语、思想或西方文本中的船名。

< em >…表示强调。

(这些都是从W3C来源直接引用的,其中还添加了我的重点。原文见:https://rawgithub.com/whatwg/html-differences/master/Overview.html#changed-elements和http://www.w3.org/TR/html401/struct/text.html#h-9.2.1)

只有在使用CSS样式类不方便或不可能的情况下才使用它们(比如博客系统,只允许在帖子中使用一些标签,最终嵌入样式)。另一个原因是支持非常老的浏览器(一些移动设备?)或原始的搜索引擎(给<b>或<strong>标签加分,而不是分析CSS样式)。

如果你可以定义CSS样式,那就使用它们。