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


当前回答

通常应该尽量避免<b>和<i>。它们在CSS创建之前的早期HMTL版本中被引入用于布局页面(改变它的外观),就像同时删除的字体标签一样,主要是为了向后兼容,因为一些论坛允许内联HTML,这是一种简单的改变文本外观的方法(比如BBCode使用[i],你可以使用<i>等等)。

自从CSS创建以来,布局实际上不再是HTML中应该做的事情,这就是为什么CSS被创建在第一个地方(HTML ==结构,CSS ==布局)。这些标签在未来可能会消失,毕竟,如果你需要一个“毫无意义”的字体变化,你可以使用CSS和span标签来使文本变成粗体/斜体。HTML 5仍然允许这样做,但声明以这种方式标记文本没有意义。

另一方面,<em>和<strong>只表示某些内容被“强调”或“强烈强调”,它让浏览器完全开放如何渲染它。大多数浏览器默认会将em显示为斜体和粗体,但它们并不是被迫这样做的(它们可能使用不同的颜色、字体大小、字体等等)。您可以使用CSS以您想要的方式更改行为。如果你喜欢,你可以让它们加粗,比如加粗和红色。

其他回答

HTML格式元素:

HTML还定义了特殊元素,用于定义具有特殊含义的文本。 HTML使用像<b>和<i>这样的元素来格式化输出,比如粗体或斜体文本。

HTML粗体和强格式:

HTML <b>元素定义了粗体文本,没有任何额外的重要性。

<b>This text is bold</b>

HTML <strong>元素定义了强文本,并添加了语义 “强大”的重要性。

<strong>This text is strong</strong>

斜体和强调格式:

HTML <i>元素定义了斜体文本,没有任何额外的内容 的重要性。

<i>This text is italic</i>

HTML <em>元素定义了带有附加语义的强调文本 的重要性。

<em>This text is emphasized</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)

<b>和<i>是显式的-它们分别指定粗体和斜体。

<strong>和<em>是语义上的-它们指定所包含的文本应该以某种方式“强”或“强调”,通常是粗体和斜体,但允许通过CSS控制实际的样式。因此,这些是现代网页的首选。

正如其他人所述,区别在于<b>和<i>硬编码字体样式,而<strong>和<em>指示语义,字体样式(或语音浏览器语调,或其他什么)在文本呈现(或语音)时确定。

You can think of this as a difference between a “physical” font style and a “logical” style, if you will. At some later time, you may wish to change the way <strong> and <em> text are displayed, say, by altering properties in a style sheet to add color and size changes, or even to use different font faces entirely. If you've used “logical” markup instead of hardcoded “physical” markup, then you can simply change the display properties in one place each in your style sheet, and then all of the pages that reference that style sheet get changed automatically, without ever having to edit them.

很狡猾,是吧?

这也是为段落、表格单元格、标题文本、标题等定义子样式(在文本标记中使用style=属性引用)以及使用<div>标记的基本原理。您可以在样式表中为逻辑样式定义物理表示,更改会自动反映在引用该样式表的网页中。想要源代码的不同表示形式?重新定义“代码”风格的字体、大小、粗细、间距等。

如果使用XHTML,甚至可以定义自己的语义标记,样式表将为您完成到物理字体样式和布局的转换。

它们对普通的web浏览器渲染引擎有相同的效果,但它们之间有根本的区别。

正如作者在一篇讨论列表帖子中写道:

想想三种不同的情况:

web浏览器 盲人 移动电话

“大胆”是一种风格——当你说“大胆一个字”时,人们基本上都知道 这意味着在字母周围添加更多的“墨水”,直到它们突出 其余的信里有更多。

不幸的是,这对盲人来说毫无意义。在手机上 和其他pda,文本已经是粗体,因为屏幕分辨率非常小。你不能在没有搞砸的情况下加粗。

<b>是一种样式——我们知道“粗体”应该是什么样子。

然而,<strong>表示应该如何理解某些内容。“Strong”在浏览器中可能(通常)意味着“粗体”,但对于Jaws(盲人)这样的语音程序来说,它也可能意味着较低的音调,或者在Palm Pilot上用下划线表示(因为你不能用粗体加粗)。

HTML从来就不是关于样式的。搜索“Tim Berners-Lee”和“语义网”。>是语义的——它描述了它包围的文本(例如,“这个文本应该比你所显示的其余文本更强”),而不是描述它包围的文本应该如何显示(例如,“这个文本应该是粗体”)。