<b>和<strong>,<i>和<em>之间有什么区别?

Phi*_*ton 749 html xhtml

什么之间的区别<b><strong>,<i><em>在HTML/XHTML?你应该什么时候使用?

spl*_*tne 1010

它们对普通的Web浏览器渲染引擎具有相同的效果,但它们之间存在根本区别.

正如作者在讨论列表中写道:

想想三种不同的情况:

  • 网络浏览器
  • 盲人
  • 手机

"大胆"是一种风格 - 当你说"大胆一个字"时,人们基本上知道这意味着在字母周围添加更多,让我们说"墨水",直到它们在其余字母中脱颖而出.

不幸的是,这对盲人来说毫无意义.在手机和其他PDA上,文本已经很大胆,因为屏幕分辨率非常小.如果不搞砸,你就不能大胆加粗.

<b>是一种风格 - 我们知道应该是什么样的"大胆".

<strong>然而,这表明应该如何理解某些东西."强"可以(并且经常)在浏览器中表示"大胆",但它也可能意味着像Jaws(对于盲人)这样的演讲程序的低调,或者由下划线表示(因为你不能加粗在Palm Pilot上大胆).

HTML从来就不是关于样式的.做一些搜索"蒂姆·伯纳斯-李""语义网". <strong>是语义它描述它围绕文本(例如,"这段文字应该比你显示的文本的其余部分强"),而不是描述如何其围绕文本应显示(例如,"这段文字应该是大胆").

  • 请注意,HTML5中不推荐使用<b>和<i>**.它们的新用途是在语义上表示样式(或预期的表示),而<strong>和<em>表示**结构**.你必须阅读http://stellify.net/html5-b-and-i-tags-are-going-to-be-useful-read-semantic-again/ (151认同)
  • @deathApril但是他们做到了!他们确实有意义!HTML不是由您的信念或您决定的内容定义的. (19认同)
  • 很好的答案,但我会说"你不能大胆加粗"是错误的,因为你假设它是一个布尔概念,当font-weight:采取更多变量的方法.现在存在高保真屏幕,有一定程度的大胆. (11认同)
  • @TravisO我相信他正在谈论Palm Pilot的具体技术限制. (4认同)
  • 我不相信一堆字母有任何内在含义,如果我们决定,<b>可以与<strong>具有完全相同的语义.读者的决定者做了什么,他们是以不同的方式对待它们还是以同样的方式对待它们? (4认同)
  • @poepje ....但是语义应该始终是一个问题.你永远不知道什么时候你想要重新定位或改编网页之类的东西以达到更一般的目的.由于某些样式表/标记技术*以不同方式处理"<b>"和"<strong>"标记,因此您无法保证永远不会有差异,*即使*您最初没有*计划*通过不同的技术可以看到标记.(特别是在网络的情况下,你绝对无法知道人们将如何使用你的内容.) (3认同)
  • *在HTML5 *下(以及7年后),我不同意“ &lt;b&gt;是一种样式-我们知道“粗体”应该是什么样子”-请参阅http://stackoverflow.com/a/1348704/2864740。HTML 5 LD还明确指出“样式表可用于设置b元素的格式,就像其他任何元素都可以重新设置样式一样。因此,并非必须将b元素中的内容加粗。” (3认同)

Ton*_*ews 223

<b>并且<i>是明确的 - 它们分别指定粗体和斜体.

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

  • [HTML5](http://dev.w3.org/html5/spec/spec.html)对`b`和`i`有新的语义含义.当你需要引起对散文的一部分的注意,或者偏移正常的散文时,它们是你应该使用的标签,*没有*传达重点(`em`),重要性(对于'强')或相关性(对于`mark`) ).`b`用于关键词,产品名称,可操作词等,而`i`用于技术术语,思想,短语等.老实说IMO,两者之间需要有更大的区别. (25认同)
  • 很好的解释.另一方面,对于HTML 5,<i>和<b>也是语义而非显式.叹. (15认同)
  • 是的,我读过的最好的解释是http://stellify.net/html5-b-and-i-tags-are-going-to-be-useful-read-semantic-again/ (5认同)
  • 太糟糕了stellify.net文本(和标题)在大多数便宜的办公室显示器和设置上完全不可读^^(缺乏对比度简直令人惊叹) (2认同)

Jam*_*mes 24

<strong><em>为您的文档添加额外的语义含义.恰巧它们也为您的文本提供了大胆和斜体的风格.

你当然可以用CSS覆盖它们的样式.

<b><i>在另一方面只适用的字体样式,不应再使用.(因为您应该使用CSS格式化,如果文本实际上很重要,那么无论如何您可能会使其"强大"或"强调"!)

希望有道理.

  • @Nirman如果有人使用旧浏览器浏览网页,从视觉和安全的角度来看,他或她已经遇到很多问题.因此,我相信程序员和设计师不应再支持旧的浏览器了. (4认同)
  • 注意:如果我们说旧浏览器,我们指的是Netscape 3和IE2(IE3和NS4已经支持<strong>和<em>).如果你真的需要继续支持那些20世纪的浏览器,你就会遇到很大麻烦. (3认同)
  • 如果你说,<b>和<i>应该不再使用,那么那些不支持<em>和<strong>的旧浏览器呢? (2认同)
  • 这个答案是在 HTML5 发布前大约 6 年发布的! (2认同)

squ*_*ndy 14

我将在这里冒险提出一个历史和实际的热门观点:

\n

是的,根据规范,<strong>在 HTML4 中具有语义含义并且<b>具有严格的表示含义。

\n

b是的,当 HTML5 出现时,为和引入了略有不同的新语义i

\n

是的,W3C 推荐\xe2\x80\x94 基本上是 \xe2\x80\x94 TL,DR;不要使用 b 和 i。

\n
\n

您应该始终记住,ab 元素的内容可能并不总是粗体,i 元素的内容可能并不总是斜体。实际的样式取决于 CSS 样式定义。您还应该记住,粗体和斜体可能不是某些语言内容的首选样式。如果有更具描述性和相关性的标签可用,则不应使用 b 和 i 标签。

\n
\n

但:

\n

现实世界的互联网拥有大量永远不会更新的现有 HTML。现实世界的互联网必须考虑在庞大的软件网络和 CMS 系统之间生成、复制和粘贴的内容,这些系统都有不同的开发团队,并且是在不同的时代构建的。

\n

因此,如果您正在编写 HTML 或构建一个为其他人编写 HTML 的系统 \xe2\x80\x94,那么 \xe2\x80\x94 肯定使用 \xe2\x80\x94<strong>而不是<b>表示“强烈强调”,因为它在语义上更正确。

\n

但事实上,实际情况是, 和 的语义和文体意义<strong>随着<b>时间的推移已经出于必要而融合。

\n

如果我正在构建一个允许粘贴任何样式文本的 CMS,我需要为粘贴<b>并表示“强烈强调”的用户和粘贴<strong>并表示“使该文本变为粗体”的用户做好计划。这可能不“正确”,但这就是现实世界此时此刻的运作方式。

\n

因此,如果我正在为该网站编写样式表,我可能最终会编写一些如下所示的样式:

\n
b,\nstrong {\n  font-weight: 700;\n  /* ... more styles here */\n}\n\ni,\nem {\n  font-style: italic;\n  /* ... more styles here */\n}\n
Run Code Online (Sandbox Code Playgroud)\n

或者,我将依赖浏览器默认设置,它与我所知道的每个现代浏览器中的上述代码执行相同的操作。

\n

或者,我可能是数百万个使用normalize.css 的网站之一,该网站会注意确保 b 和 Strong 得到相同的对待

\n

世界上已经有如此巨大的 HTML 海洋可以满足这种期望,我只是无法想象它b会因为有利于strong或浏览器将开始默认以不同的方式显示它们。

\n

就是这样了。这就是我对语义、历史和现实世界的热门看法。b/i 和 Strong/em 相同吗?不会。直到现代文明崩溃之前,它们是否会同时存在并在几乎所有情况下都被视为相同?我想是的。

\n


Ric*_*era 8

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

<b>...文本跨度关注所正在绘制功利的目的,而不输送任何额外的重要性,并没有暗示替代的语态和语气,如关键词在一个文档抽象,产品名称在评论中,可操作的话在交互式文本驱动软件或文章.

<strong> ......现在代表着重要而不是强调.

<i>......以一种交替的声音或情绪,或以其他方式偏离正常散文的文本范围,表示不同的文本质量,例如分类标识,技术术语,来自另一种语言惯用短语,思想或西方文本中的船名.

<em> ......表示强调.

(这些都是来自W3C来源的直接引用,我强调了这一点.请参阅:https : //rawgithub.com/whatwg/html-differences/master/Overview.html#changed-elementshttp://www.w3.org /TR/html401/struct/text.html#h-9.2.1原件)


Kar*_*iem 7

<b>并且<i>都与风格有关,<em>而且<strong>是语义的.在HTML 4中,第一个被分类为字体样式元素,后者被分类为短语元素.

正如您所指出的那样,<i>并且<em>通常被认为是相似的,因为浏览器通常以斜体显示.但根据规范,<em> 表明强调<strong> 表明更强调,这是非常明确的,但经常被误解.另一方面,何时使用<i>或者<b>真正属于风格的区别.

  • 我认为HTML5规范只是更加区分两者.在我的解释中,"强调"意味着语调的压力.例如,"你想通过*THOSE*牛仔裤?" 与"你想*买*那些牛仔裤?" 由于重点放置,具有不同的含义.OTOH,"重要性"没有基于展示位置的效果.例如,"**警告**:小心狗!" 如果重要性被删除,那意义相同. (3认同)

mwi*_*iik 7

虽然<strong>并且<em>当然在语义上更正确,但似乎有合理的理由将<b><i>标签用于客户编写的内容.

在这样的内容中,单词或短语可以用粗体或斜体表示,并且通常不由我们来分析用于这种粗体或斜体的语义推理.

此外,这样的内容可以指粗体和斜体的单词和短语以传达特定含义.

一个例子是英语考试问题,它指示学生替换加粗的单词.


Tho*_*ing 6

<em>并且<strong><i>和消耗更多的带宽<b>

它们还需要更多的输入(如果不是自动生成的)。

它们还会用更多的文本使编辑器屏幕变得混乱。我似乎记得程序员喜欢较小的源文件,如果它们相同的话。(让我们说实话,它们是一样的。是的,存在“技术”(<i></i>,咳咳,对不起)差异,但这主要是假的。)

使用上述任何标签,您可以使用样式表自定义它们的显示方式,如果您需要它们的显示方式与其默认渲染不同。

  • 哈哈,这应该是公认的答案[(HHOS)。](http://www.catb.org/jargon/html/H/ha-ha-only-serious.html)你的答案是最脚踏实地的并在整个页面上提供正确答案,即使这有点开玩笑。从一开始,关于“语义”的整个事情就是一个愚蠢的游戏。我们都知道,任何查找此问题的人都在与主要浏览器供应商合作,Chrome、Firefox、IE 等。我们只是想知道*真实*、*实际*差异可能是什么,而不是委员会在其丰富的业余时间中进行辩论。 (2认同)

adn*_*2nd 5

<i><b><em>标签<strong>传统上具有代表性。但它们在HTML5中被赋予了新的语义

<i><b>用于 HTML4 中的字体样式。<i>用于斜体和<b>粗体。在HTML5中,标签具有“替代语气或语气<i>的新语义,并且标签具有文体上偏移的含义。<b>

标签的示例用途<i>包括:分类名称、技术术语、另一种语言的惯用短语、音译、思想、西方文本中的船舶名称。例如 -

<p><i>I hope this works</i>, he thought.</p>
Run Code Online (Sandbox Code Playgroud)

标签的示例用途<b>包括文档摘录中的关键字、评论中的产品名称、交互式文本驱动软件中的可操作单词、文章导语。

以下示例段落在风格上与其后面的段落有所不同。

<p><b class="lead">The event takes place this upcoming Saturday, and over 3,000 people have already registered.</b></p>
Run Code Online (Sandbox Code Playgroud)

<em>在HTML4中具有<strong>强调和强调的意思。但在HTML5中<em>意味着强调强调并且<strong>意味着强烈的重要性

在下面的例子中,阅读之前的单词时应该有语言上的变化......

<p>Make sure to sign up <em>before</em> the day of the event, September 16, 2016</p>
Run Code Online (Sandbox Code Playgroud)

在同一个示例中,我们可以<strong>按如下方式使用标签..

<p>Make sure to sign up <em>before</em> the day of the event, <strong>September 16, 2016</strong></p>
Run Code Online (Sandbox Code Playgroud)

重视活动日期。

MDN 参考:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/b

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/strong