HTML 字符实体

Begindev 编辑部 March 25, 2026

HTML 是一种基于“标签”的语言，这意味着某些字符在 HTML 中具有特殊含义。比如小于号 < 和大于号 > 是用来定义标签的。

如果你想在网页上显示一个实际的 <p> 文本，而不是让浏览器把它解析为一个段落标签，该怎么办？直接写 <p> 是不行的，因为浏览器会以为你开始了一个新段落。

这时，你就需要 HTML 实体 (HTML Entities)。

1. 理解 HTML 实体

HTML 实体是一段以 & 开头、以 ; 结尾的特殊代码。

作用：告诉浏览器“不要把这个字符当成代码执行，把它当成普通文字显示出来！”。
格式：通常有两种写法——实体名称（如 <）和实体编号（如 <）。
特性：它是我们在 HTML 中显示“保留字符”和“不可见字符”的唯一标准方式。

2. 对比：直接输入 vs. 使用实体

让我们看看浏览器如何处理直接输入的特殊字符和使用实体后的区别。

2.1 直接输入特殊字符

<p>
    如果你想写一个标题，不要用 <h1> 标签。
    我真的非常喜欢 A & B 公司。
</p>

浏览器解析结果（可能出现的问题）：

<h1> 可能会被浏览器误认为是开始一个新的标题，导致页面结构错乱，或者直接被隐藏（因为浏览器试图解析它）
& 在某些严格模式下可能会引起解析错误，因为它期待后面跟着一个实体代码。

2.2 使用 HTML 实体

<p>
    如果你想写一个标题，不要用 &lt;h1&gt; 标签。
    我真的非常喜欢 A &amp; B 公司。
</p>

浏览器显示结果： 如果你想写一个标题，不要用 <h1> 标签。我真的非常喜欢 A & B 公司。 (注意：所有的符号都按照我们预期的样子显示出来了，没有破坏页面结构。)

3. 关键特性

转义保留字符：最主要的功能是让 <、>、&、" 等具有语法意义的符号回归纯文本。
显示键盘打不出的符号：比如版权符号 ©、欧元符号 €，甚至是一些数学符号。
防止空白合并：还记得 HTML 会合并空格吗？实体   可以让你强制保留空格。

4. 实战示例

4.1 示例 1：显示 HTML 代码

这是技术博客最常用的场景。为了在网页上教别人写代码，你必须把代码里的尖括号全部转义。

<!DOCTYPE html>
<html lang="zh-CN">
<body>
    <h1>如何在网页显示代码</h1>
    <p>请看下面的例子：</p>
    
    <p>
        要定义一个段落，我们使用 &lt;p&gt; 标签。<br>
        要定义一个链接，我们使用 &lt;a href="..."&gt; 标签。
    </p>
    
    <p>注意：这里的 &lt; 和 &gt; 告诉浏览器只显示形状，不执行功能。</p>
</body>
</html>

4.2 示例 2：强制空格与特殊排版

默认的空格键（Space）在 HTML 中会被折叠，但“不换行空格”（Non-Breaking Space, ）不会。

负责占位（浏览器不会合并它）。
它还有一个特性：它连接的两个词中间不会发生自动换行。

<!DOCTYPE html>
<html lang="zh-CN">
<body>
    <h2>价格显示</h2>
    <p>套餐流量：100&nbsp;MB</p>

    <h2>缩进模拟（不推荐，但原理可行）</h2>
    <p>
        &nbsp;&nbsp;&nbsp;&nbsp;这是一个使用了四个 &nbsp; 进行缩进的段落。
        虽然通常我们建议用 CSS 的 text-indent，但在某些微调场景下它很有用。
    </p>
</body>
</html>

4.3 示例 3：版权、货币与图标

很多时候你需要显示键盘上没有的符号。

<h2>页脚信息</h2>
<p>
    版权所有 &copy; 2025 Begindev Inc.<br>
    注册商标：MyBrand&reg;<br>
    特惠价格：&yen;99.00 (原价 &euro;15.00)
</p>

浏览器显示结果：

注册商标：MyBrand®

特惠价格：¥99.00 (原价 €15.00)

5. 重要注意事项：语法陷阱

在使用实体时，有两个初学者最容易犯的错误。

5.1 忘记分号

每一个实体都必须以分号 ; 结尾。

5.2 实体名称是区分大小写的

虽然大多数 HTML 标签不区分大小写，但实体通常是区分的。

&COPY; 是无效的，或者在某些特殊字库中代表完全不同的东西。

6. 总结

当你想在屏幕上显示 <、>、& 或 " 时，必须使用实体。
当且仅当需要特殊的排版控制（如禁止换行）时，使用 &nbsp;。
记住公式：& + 名称 + ;，缺一不可。

附录：一些常用的 HTML 字符实体

页面显示内容	描述	实体名称（文本形式）	实体编号（文本形式）
	不换行空格
<	小于号	<	<
>	大于号	>	>
&	和号 / 与号	&	&
"	双引号	"	"
'	单引号	'	'
¢	分（美分）	¢	¢
£	英镑	£	£
¥	人民币/日元通用符号	¥	¥
€	欧元	€	€
©	版权符号	©	©
®	注册商标	®	®
™	商标	™	™