Skip to content
W3S101

HTML 实体

HTML 实体

Section titled “HTML 实体”

某些字符在 HTML 中有特殊含义（例如 <，它用于开始一个标签）。为了将这些字符作为文本内容字面显示，你必须使用字符实体（character entities）。

实体也用于显示标准键盘上不容易输入的字符（例如 © 或 €）。

什么是 HTML 实体？

Section titled “什么是 HTML 实体？”

HTML 实体是一段以与号（&）开头并以分号（;）结尾的文本（字符串）。实体代表特定的字符。

有两种类型：

  • **命名实体：**使用一个易于记忆的名称（例如，&lt; 代表 <，&amp; 代表 &，&copy; 代表 ©）。更易读和记忆。
  • **数字实体：**使用一个对应于字符在 Unicode 中的码位（code point）的数字（例如，&#60; 代表 <，&#38; 代表 &，&#169; 代表 ©）。浏览器普遍支持。

语法：

&entity_name;
<!-- or -->
&#entity_number;

例如，要在文本中字面显示 <p>，你必须写 &lt;p&gt; 或 &#60;p&#62;。

提示：虽然命名实体因可读性常被首选，但数字实体可以保证显示，即使浏览器不识别某个特定的名称（尽管对于常用实体这种情况很少见）。

基本实体：保留字符

Section titled “基本实体：保留字符”

当你希望这些字符作为字面文本出现，而不是被解释为 HTML 标记（markup）时，你必须使用它们的实体形式：

字符描述命名实体数字实体
<小于号&lt;&#60;
>大于号&gt;&#62;
&与号&amp;&#38;
”双引号&quot;&#34; (在用双引号引用的属性值内很有用)
‘单引号（撇号）&apos;&#39; (在用单引号引用的属性值内很有用)

示例：

<p>The formula is: E = mc&lt;sup&gt;2&lt;/sup&gt;.</p>
<p>Tom &amp; Jerry is a classic cartoon.</p>
<p>He said, &quot;Use entities!&quot;</p>

不间断空格

Section titled “不间断空格”

浏览器在渲染时，会将 HTML 源代码中多个连续的空白字符（空格、制表符、换行符）折叠成一个单一的空格。

要插入浏览器不会折叠的明确空格，或防止两个单词之间换行，请使用不间断空格实体：&nbsp;（或 &#160;）。

示例：让 ‘10 km’ 保持在同一行上。

<p>The distance is 10&nbsp;km.</p>

谨慎使用 &nbsp;；CSS 的 margin 和 padding 是控制间距的标准方式。

其他常用字符实体

Section titled “其他常用字符实体”
结果描述命名实体数字实体
©版权符号&copy;&#169;
®注册商标符号&reg;&#174;
™商标符号&trade;&#8482;
€欧元符号&euro;&#8364;
£英镑符号&pound;&#163;
¥日元符号&yen;&#165;
¢美分符号&cent;&#162;
•项目符号&bull;&#8226;
—长划线&mdash;&#8212;
–短划线&ndash;&#8211;

注意：实体名称区分大小写（&nbsp; 有效，&NBSP; 无效）。

实体与 UTF-8 编码

Section titled “实体与 UTF-8 编码”

现代网页应始终使用 UTF-8 字符编码，在 <head> 中通过 <meta charset="UTF-8"> 声明。UTF-8 支持几乎所有语言中使用的所有字符。

使用 UTF-8，你通常可以直接在 HTML 源代码中输入 ©, €, £ 或带重音符号的字母等字符，它们无需使用实体即可正确显示。

示例（使用 UTF-8）：

<p>Price: €50. Copyright © 2024.</p>
<p>¡Hola, señor!</p>

然而，对于保留字符 <, >, 和 &，你仍然必须使用实体，以避免破坏你的 HTML 结构。对于其他特殊字符（&copy;、&euro; 等），使用实体仍然是直接输入的有效且有时更清晰的替代方法。

有关 HTML 实体的完整列表，请参阅 MDN Web Docs 等资源。