HTML em、strong 标签:强调、重要性与 b、CSS 的区别
创建时间 2026-10-30
最后修改 2026-10-30
HTML 中的 <em> 用于标记句子中的语气强调,而 <strong> 用于标记强烈的重要性、严肃性或紧迫性。浏览器通常将它们分别呈现为斜体和加粗文本,但应根据上下文中的含义选择元素,而不是依据其默认外观。
em 和 strong 有何不同?
当强调某个特定单词会改变句子的重点时使用 em。在“我今天检查了文件”中,强调“我”则聚焦于是谁检查的,而强调“今天”则聚焦于什么时候检查的。strong 标记内容本身的重要性,例如读者需要知道的警告或重要结论。
两个元素都可以在句子中使用。不要仅仅为了让段落看起来像大标题而包裹整个段落。文档标题的结构使用 h1 到 h6,并仅在必要时应用有意义的强调。
在完整示例中比较重点
将此文档保存为 emphasis.html 并在浏览器中打开。比较前两句话、重要指令以及仅使用视觉加粗样式的最后一句话的重音。
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>区分强调与重要性</title>
<style>.visual-bold { font-weight: bold; }</style>
</head>
<body>
<h1>根据语境强调</h1>
<p><em>我</em>今天检查了文档。</p><p>我<em>今天</em>检查了文档。</p><p><strong>替换文件前请检查备份。</strong></p><p>本文术语:<b>元素</b>和<b>属性</b></p><p>视觉样式示例:<span class="visual-bold">此处通过 CSS 加粗。</span></p></body>
</html>
在常见的默认样式下,“我”和“今天”会以斜体显示,而备份指令和标记为 b 的术语会以加粗显示。由于 CSS,span 也会加粗,但它不会成为表示强重要性的元素。字体和用户样式可能会改变外观,因此也应在措辞中清楚表达重要含义。
区分 b 与 CSS 加粗样式
| 选择 | 目的 |
|---|---|
| em | 标记句子中的重音和强调的焦点。 |
| strong | 标记重要性、严肃性或紧迫性。 |
| b | 引起对术语或其他文本的注意而不增加重要性。 |
| CSS font-weight | 在不增加重要性或其他 HTML 意义的情况下控制视觉粗细。 |
如果仅将 b 视为“没有意义的strong”,就会误解其目的:它是用来引起注意的。当只是为了外观时,请使用 CSS。同样,不要仅因为想要斜体文本而选择 em。
通过 CSS 删除 em 的斜体或更改 strong 的粗细不会改变 HTML 中表达的含义。相反,将 span 设置为加粗并不会赋予其 strong 的语义。辅助技术的实际公告因环境而异,因此不要假设特定的语音变化总是会发生。有关元素定义,请参见 MDN em 参考 、MDN strong 参考 和 MDN b 参考 。




