编程笔记 html5&css&js 019 HTML实体

简介: 编程笔记 html5&css&js 019 HTML实体

在HTML文档中,用一些标记表示特定的格式,那我们想使用这些标记字符本身时就出了问题,直接使用时,会被浏览器解析为标记的,要想显示这些字符本身,要使用“实体”,在其他语言中,一般称为转义字符。

一、HTML 字符实体

HTML 中的预留字符必须被替换为字符实体。

在 HTML 中,某些字符是预留的。

在 HTML 中不能使用小于号(<)和大于号(>),这是因为浏览器会误认为它们是标签。

如果希望正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体(character entities)。

字符实体类似这样:

&entity_name;

或者

&#entity_number;

如需显示小于号,我们必须这样写:&lt; 或 &#60;

提示:使用实体名而不是数字的好处是,名称易于记忆。不过坏处是,浏览器也许并不支持所有实体名称(对实体数字的支持却很好)。

不间断空格(non-breaking space)

HTML 中的常用字符实体是不间断空格(&nbsp;)。

浏览器总是会截短 HTML 页面中的空格。如果您在文本中写 10 个空格,在显示该页面之前,浏览器会删除它们中的 9 个。如需在页面中增加空格的数量,您需要使用 &nbsp; 字符实体。

HTML 中有用的字符实体

注释:实体名称对大小写敏感!

显示结果 描述 实体名称 实体编号

空格  &nbsp;  &#160;
< 小于号 &lt;  &#60;
> 大于号 &gt;  &#62;
& 和号  &amp; &#38;
" 引号  &quot;  &#34;
' 撇号  &apos; (IE不支持)  &#39;
¢ 分(cent) &cent;  &#162;
£ 镑(pound)  &pound; &#163;
¥ 元(yen)  &yen; &#165;
€ 欧元(euro)  &euro;  &#8364;
§ 小节  &sect;  &#167;
© 版权(copyright) &copy;  &#169;
® 注册商标  &reg; &#174;
™ 商标  &trade; &#8482;
× 乘号  &times; &#215;
÷ 除号  &divide;  &#247;

键盘上不存在的字符也可以由实体代替。

二、HTML 符号实体

普通键盘上不存在众多数学、技术和货币符号。

如需将此类符号添加到 HTML 页面,您可以使用 HTML 实体名称(HTML entity name)。

如果不存在实体名称,则可使用实体编号,十进制或十六进制的引用。

<p>我将显示 &</p>
<p>我将显示 &#8364;</p>
<p>我将显示 &#x20AC;</p>

将显示为:

我将显示 €
我将显示 €
我将显示 €

HTML 支持的一些数学符号

字符 数字 实体 描述

∀ &#8704; &forall;  FOR ALL
∂ &#8706; &part;  PARTIAL DIFFERENTIAL
∃ &#8707; &exist; THERE EXISTS
∅ &#8709; &empty; EMPTY SETS
∇ &#8711; &nabla; NABLA
∈ &#8712; &isin;  ELEMENT OF
∉ &#8713; &notin; NOT AN ELEMENT OF
∋ &#8715; &ni;  CONTAINS AS MEMBER
∏ &#8719; &prod;  N-ARY PRODUCT
∑ &#8721; &sum; N-ARY SUMMATION

HTML 支持的一些希腊字母

字符 数字 实体 描述

Α &#913;  &Alpha; GREEK CAPITAL LETTER ALPHA
Β &#914;  &Beta;  GREEK CAPITAL LETTER BETA
Γ &#915;  &Gamma; GREEK CAPITAL LETTER GAMMA
Δ &#916;  &Delta; GREEK CAPITAL LETTER DELTA
Ε &#917;  &Epsilon; GREEK CAPITAL LETTER EPSILON
Ζ &#918;  &Zeta;  GREEK CAPITAL LETTER ZETA

HTML 支持的一些其他实体。

字符 数字 实体 描述

© &#169;  &copy;  COPYRIGHT SIGN
® &#174;  &reg; REGISTERED SIGN
€ &#8364; &euro;  EURO SIGN
™ &#8482; &trade; TRADEMARK
← &#8592; &larr;  LEFTWARDS ARROW
↑ &#8593; &uarr;  UPWARDS ARROW
→ &#8594; &rarr;  RIGHTWARDS ARROW
↓ &#8595; &darr;  DOWNWARDS ARROW
♠ &#9824; &spades;  BLACK SPADE SUIT
♣ &#9827; &clubs; BLACK CLUB SUIT
♥ &#9829; &hearts;  BLACK HEART SUIT
♦ &#9830; &diams; BLACK DIAMOND SUIT

小结

知道有些无法表示的字符或符号,可以用“实体”这东西来替换就行了,用的时候可以现查的。

相关文章
|
2天前
|
JavaScript 前端开发 BI
原生html—摆脱ps、excel 在线绘制财务表格加水印(html绘制表格js加水印)
原生html—摆脱ps、excel 在线绘制财务表格加水印(html绘制表格js加水印)
7 1
|
10天前
|
JavaScript 前端开发
js怎么删除html元素
js怎么删除html元素
23 10
|
11天前
|
JavaScript 前端开发 iOS开发
js实用方法记录-动态加载css/js
js实用方法记录-动态加载css/js
16 0
|
12天前
|
移动开发 前端开发 JavaScript
CSS选择器 前端开发入门笔记(十)
CSS选择器 前端开发入门笔记(十)
19 1
|
12天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
18 1
|
19天前
|
JSON JavaScript 前端开发
js是什么、html、css
js是什么、html、css
|
25天前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性
|
17天前
|
前端开发 JavaScript 开发工具
【HTML/CSS】入门导学篇
【HTML/CSS】入门导学篇
23 0
|
8天前
|
数据采集 前端开发 网络协议
如何使用代理IP通过HTML和CSS采集数据
如何使用代理IP通过HTML和CSS采集数据
|
12天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册