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


当前回答

问:strong, b, bold, em, i的区别?

答:这些是内联属性。

Strong:用于在语义上加粗显示文本或突出显示文本。

粗体或b:这个粗体标记只是常规粗体样式的偏移文本。

Em: < Em >标记在语义上强调重要的单词。

I: < I >标签只是斜体样式的偏移文本。

注意:您应该使用<strong></strong>和<em></em>标签,它们的有意义的名称告诉内容的类型。语义标签对SEO也有帮助。

其他回答

它们对普通的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>之间的区别实际上是一个风格问题。

问:strong, b, bold, em, i的区别?

答:这些是内联属性。

Strong:用于在语义上加粗显示文本或突出显示文本。

粗体或b:这个粗体标记只是常规粗体样式的偏移文本。

Em: < Em >标记在语义上强调重要的单词。

I: < I >标签只是斜体样式的偏移文本。

注意:您应该使用<strong></strong>和<em></em>标签,它们的有意义的名称告诉内容的类型。语义标签对SEO也有帮助。

<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>指示语义,字体样式(或语音浏览器语调,或其他什么)在文本呈现(或语音)时确定。

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,甚至可以定义自己的语义标记,样式表将为您完成到物理字体样式和布局的转换。