新手写网页，为了让字变粗，随手就是一个 ``，为了倾斜就是一个 ``。但这在现代前端开发中是一个巨大的坑。

在 HTML 的早期，没有 CSS，标签确实是用来控制样式的。但随着标准演进，HTML 只负责声明“语义（这是什么）”，长什么样全部交给了 CSS。如果你还在用标签来做“纯视觉展示”，不仅会破坏代码规范，还会导致屏幕阅读器（视障用户工具）和搜索引擎（SEO）无法正确识别网页的重点。

> 💡 **核心定律**：永远不要为了改变字体样式（加粗、斜体）去使用 HTML 标签。如果你只想改变外观，请使用 CSS。

## 一、语气强调：`` (Emphasis)

`` 用于改变句子的**重音位置**，从而改变句子的确切含义。默认表现为斜体。

就像我们日常说话，加重不同的字，意思就截然不同：

- 原句：我没有说他偷了钱。
- 强调“我”：`我没有说他偷了钱。`（潜台词：可能是别人说的。）
- 强调“偷”：`我没有说他偷了钱。`（潜台词：他可能是借的。）


## 二、重要性强调：``

`` 用于标记**极其重要、严重警告**的信息。默认表现为加粗。

屏幕阅读器遇到 `` 时，会明显加重语气朗读，提醒用户这部分绝对不能忽略。

```html

这个液体有剧毒，千万别碰！


这个液体有剧毒——喝了会死！
```

## 三、被降级的“视觉/语境”标签：``、``、``

这三个标签曾经代表纯样式的斜体、加粗和下划线。在 HTML5 中，它们被赋予了新的、更微弱的语义，不再代表重点或强调。

### 1. ``：语境切换 (Idiomatic Text)
不再是单纯斜体，而是表示**这段文本属于另一种语境**，与周围的文字区分开来。
**适用场景**：外文单词、科学学名、人物内心的想法。

```html

菜单上有soupe à l'oignon（法语：洋葱汤）。

我真的很开心。
```

### 2. ``：单纯视觉突出 (Bring Attention To)
不再是重要警告，而是表示**需要视觉上醒目，但不具备任何额外的重要权重**。
**适用场景**：文档里的关键词、产品名、摘要里的导读词。

```html

我买了新电脑：MacBook Air M2。

前方施工，请绕行！
```

### 3. ``：特殊异常标记 (Unarticulated Annotation)
不再是普通的下划线，而是用于**指出文本中存在某种非正常的特殊情况**。
**适用场景**：拼写错误的单词。

> ⚠️ **注意事项**：在网页中，带下划线的文字约定俗成代表“超链接”。除非是标记拼写错误，否则绝对不要使用 `` 或者给普通文字加下划线，这会误导用户认为这是一个可点击的链接。

```html

今天超市的鸡蛋全部免费送！


我昨天网记带伞了（注：作者打错字了，原意是“忘”）。

```
**效果：**
![image.png](https://developer.qcloudimg.com/http-save/yehe-12096415/4dd4ae42b551e1684efdbc8138deffe8.png)

## 四、已被废弃的“纯样式标签”

以下标签因为**百分之百只有样式、毫无语义**，已经被 HTML 标准彻底废弃。现在开发中严禁使用。

| 废弃标签 | 旧作用 | 现代替代方案（CSS 或语义标签） |
| :--- | :--- | :--- |
| `<big>` | 字变大 | `font-size: 1.2em` |
| `` | 改字号颜色 | `color: red; font-size: 16px` |
| `<strike>` | 加删除线 | `<s>` (表示已过期信息) 或 `text-decoration: line-through` |

## 五、总结与下一步

> 📝 **速记总结**：
> - `` = 真的非常**重要**（必须警惕/重视）。
> - `` = 改变句子的**重音**位置（从而改变含义）。
> - `` / `` = 仅仅需要**视觉高亮**或标明**特殊语境**，但不改变重要性。
> - 想改样式（变大、加粗），一律使用 CSS。

到目前为止，我们一直在死抠“单段文字”的细节：用 `h1` 写标题，用 `p` 写段落，用 `strong` 抓重点。

但是，如果在网页上遇到“一大串同类信息”该怎么排版？比如，教用户做菜的 10 个步骤，或是电商网站顶部的 5 个导航按钮？难道就是敲 10 个段落标签然后再手动标上 `1. 2. 3.` 吗？

当然不是。在下一章《07. HTML的 3 种列表：ul、ol、dl》中，我们将讲解如何用最纯粹的机器语言，去管理网页里的“步骤逻辑”和“并列数据”。

新手写网页，为了让字变粗，随手就是一个 ，为了倾斜就是一个 。但这在现代前端开发中是一个巨大的坑。

【大白话前端 06】HTML文本强调标签

前端

现代前端开发中，避免使用、等HTML标签控制样式，改用CSS实现视觉效果。HTML5强调语义化，表示重要内容，用于语气强调，/仅用于视觉高亮或特殊语境。遵循规范可提升SEO和可访问性，确保屏幕阅读器正确识别网页重点。

HTML5

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云AI代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

功能1上新10个字符

功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符。

功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符。

功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符

功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符

功能4上新

文章&问答评论现已支持表情

全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验

社区富文本编辑器全新改版！诚邀体验～ 

精选全网热门MCP server，让你的AI更好用 🚀

💥开发者 MCP广场重磅上线！

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

【大白话前端 06】HTML文本强调标签-腾讯云开发者社区-腾讯云

【大白话前端 06】HTML文本强调标签

【大白话前端 06】HTML文本强调标签

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐