在HTML/XHTML中<b>和<strong>, <i>和<em>之间的区别是什么?什么时候使用它们?
当前回答
它们对普通的web浏览器渲染引擎有相同的效果,但它们之间有根本的区别。
正如作者在一篇讨论列表帖子中写道:
想想三种不同的情况:
web浏览器 盲人 移动电话
“大胆”是一种风格——当你说“大胆一个字”时,人们基本上都知道 这意味着在字母周围添加更多的“墨水”,直到它们突出 其余的信里有更多。
不幸的是,这对盲人来说毫无意义。在手机上 和其他pda,文本已经是粗体,因为屏幕分辨率非常小。你不能在没有搞砸的情况下加粗。
<b>是一种样式——我们知道“粗体”应该是什么样子。
然而,<strong>表示应该如何理解某些内容。“Strong”在浏览器中可能(通常)意味着“粗体”,但对于Jaws(盲人)这样的语音程序来说,它也可能意味着较低的音调,或者在Palm Pilot上用下划线表示(因为你不能用粗体加粗)。
HTML从来就不是关于样式的。搜索“Tim Berners-Lee”和“语义网”。>是语义的——它描述了它包围的文本(例如,“这个文本应该比你所显示的其余文本更强”),而不是描述它包围的文本应该如何显示(例如,“这个文本应该是粗体”)。
其他回答
<b>和<i>都与风格有关,而<em>和<strong>是语义的。在HTML 4中,前者被归类为字体样式元素,后者被归类为短语元素。
正如您正确指出的,<i>和<em>通常被认为是相似的,因为浏览器通常以斜体显示它们。但根据规范,<em>表示强调,<strong>表示更强调,这很清楚,但经常被误解。另一方面,何时使用<i>或<b>之间的区别实际上是一个风格问题。
<b>和<i>是显式的-它们分别指定粗体和斜体。
<strong>和<em>是语义上的-它们指定所包含的文本应该以某种方式“强”或“强调”,通常是粗体和斜体,但允许通过CSS控制实际的样式。因此,这些是现代网页的首选。
<b>和<i>应该避免使用,因为它们描述了文本的风格。相反,使用<strong>和<em>,因为它们描述了文本的语义(含义)。
与HTML中的所有内容一样,您不应该考虑您希望它看起来如何,而是应该考虑您的实际含义。当然,对你来说可能只是粗体和斜体,但对屏幕阅读器来说不是。
<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>是语义的(即:“应该强调这篇文章”)。
在现代网络浏览器的环境中,很难看出两者的区别(它们似乎产生了相同的结果,对吧?),但想想为视力受损的人设计的屏幕阅读器。如果屏幕阅读器遇到<i>标记,它将不知道该做什么。但是如果它遇到<em>标签,它就知道应该向侦听器强调其中的内容。这就是实际的区别。