HTML转义字符,HTML特殊字符

HTML Character Entities.

导航:什么是转义字符? | 常用转义字符 | 转义字符组成 | 空格转义 | 常用转义字符分类 | 转义字符大全 | 字符串转义代码

HTML转义字符,字符实体

什么是HTML及转义字符?

HTML(HyperText Markup Language)超文本标记语言是一种用于创建网页的标准标记语言,不仅可以在网页上显示文字,还可以显示图片、视频等多媒体信息。

HTML转义字符英文全称是HTML Character Entities,也叫字符实体,由于HTML本身对于一些符号己经定义了作用,如 < 小于号表示HTML标签的开始,> 大于号表示HTML标签的结束,还有空格、&等符号在HTML中有特殊含义,如果直接使用会被当成HTML的一个标签,无法正常显示在网页上。

比如常用的 <div> 标签,直接使用是什么也不会显示的,因为它表示一个HTML标签,如果想要在网页上显示  <div>,就要用一些特殊的编码符号代替 < > 这些符号,HTML解释器遇到这些编码就会显示其所对应的符号,这些特殊编码就是HTML转义字符(由于直接翻译叫字符实体,并不符合我们的使用习惯,所以本文统一称为转义字符)

比如,要在网页上显示小于号 < 就在HTML代码中使用 &lt; 或 &#60;

除了已经预定义的HTML符号,还有以下这些情况使用转义字符:

1、键盘不支持输入的符号,如版权符号 © 就要用 &copy; 来代替方便输入;

2、编辑器不支持特殊符号的输入;

3、需要在页面中显示多个空格,要使用空格的转义字符 &nbsp; 。

简而言之,HTML转义字符(字符实体)是用特殊编码表示超文本标记语言HTML中的一些特殊符号,在HTML网页上使用的各种符号,常见的如空格,大于、小于号,引号等。

常用转义字符表

注:转义编号的数字可以使用十六进制,只需在#号后加x,如&#60;十六进制表示为&#x3C;

字符转义名称转义编号描述
 &nbsp;&#160;空格
<&lt;&#60;小于号
>&gt;&#62;大于号
&&amp;&#38;和号
©&copy;&#169;版权
®&reg;&#174;注册
¥&yen;&#165;人民币
&trade;&#8482;商标
÷&divide;&#247;除号
×&times;&#245;乘号
"&quot;&#34;双引号
'&apos;&#39;单引号
&ensp;&#8194;半角空格
&emsp;&#8195;全角空格
·&middot;&#183;点号
°&deg;&#176;度数

HTML转义字符的组成

转义字符由三个部分组成:

一个和号 & 开始,中间一个转义名称或者 # 和一个转义编号,以及末尾一个分号 ;

名称和编号只是表示方式不同,在网页中的显示效果是一样的,转义名称一般由英文单词或英文缩写组成,方便记忆,比如 < 的转义字符是 &lt; 实际上是 less than 的缩写。

名称和编号可以理解为域名和IP地址的概念,转义名称和域名都是为了方便人类记忆使用的,对于计算机来说最终都是要转换成数字才可以处理。

另外转义名称是区分大小写的,也就是说在使用转义名称时大小写敏感,不能随意使用大小写。

转义名称可能存在部分浏览器不兼容而无法显示的问题,而转义编号不存在这种问题。

HTML中的空格

空格是一个特殊的字符,在HTML文件中,多个连续的空格被当做一个空格处理(<pre>...</pre>之间的内容除外),标签外的空格也不会被显示,所以如果想要段落前空两格,直接输入四个空格是达不到效果的,只会显示成一个空格。

这时候有三种方案:

1、直接输入四个空格转义字符&nbsp;&nbsp;&nbsp;&nbsp;

2、先输入一个空格再输入一个转义字符,重复如此

3、第一个字符输入一个空格,其作三个使用转义字符,或前三个转义字符加最后一个空格

常用HTML转义字符分类

箭头符号

字符转义名称转义编号描述
&larr;&#8592;左箭头
&uarr;&#8593;上箭头
&rarr;&#8594;右箭头
&darr;&#8595;下箭头
&harr;&#8596;左右箭头
&crarr;&#8629;下左箭头
&lArr;&#8656;左双箭头
&uArr;&#8657;上双箭头
&rArr;&#8658;右双箭头
&dArr;&#8659;下双箭头
&hArr;&#8660;左右双箭头

数学符号

字符转义名称转义编号描述
&radic;&#8730;开方
<&lt;&#60;小于
>&gt;&#62;大于
&le;&#8804;小于等于
&ge;&#8805;大于等于
±&plusmn;&#177;加减
÷&divide;&#247;除法
×&times;&#215;乘法
&int;&#8747;积分
ƒ&fnof;&#402;函数
&sum;&#8720;求和
&spymp;&#8776;约等于
&ne;&#8800;不等于
²&sup2;&#178;平方
³&sup3;&#179;立方
&infin;&#8734;无穷

图形符号

字符转义名称转义编号描述
&loz;&#9634;菱形
&spades;&#9824;桃形
&hearts;&#9829;心形
&clubs;&#9827;梅花
&diams;&#9830;尖方块
&#9633;方框
&#9634;圆角方框
&#9651;三角形
&#9730;雨伞
&#9734;五角星

希腊字母

字符转义名称转义编号描述
α&alpha;&#945;Alpha
β&beta;&#946;Beta
γ&gamma;&#947;Gamma
δ&delta;&#948;Delta
ε&epsilon;&#949;Epsilon
ζ&zeta;&#950;Zeta
η&eta;&#951;Eta
θ&theta;&#952;Theta
ι&iota;&#953;Iota
κ&kappa;&#954;Kappa
λ&lambda;&#955;Lambada
μ&mu;&#956;Mu
ν&nu;&#957;Nu
ξ&xi;&#958;Xi
ο&omicron;&#959;Omicron
π&pi;&#960;Pi
ρ&rho;&#961;Rho
ς&sigmaf;&#962;
σ&sigma;&#963;Sigma
τ&tau;&#964;Tau
υ&upsilon;&#965;Upsilon
φ&phi;&#966;Phi
χ&chi;&#967;Chi
ψ&psi;&#968;Psi
ω&omega;&#969;Omega

HTML转义字符大全

HTML 4 Character Entities,HTML 4 转义字符大全

字符名称编号字符名称编号
&&amp;&#38;é&eacute;&#233;
<&lt;&#60;ê&ecirc;&#234;
>&gt;&#62;ë&euml;&#235;
&nbsp;&#160;ì&igrave;&#236;
¡&iexcl;&#161;í&iacute;&#237;
¢&cent;&#162;î&icirc;&#238;
£&pound;&#163;ï&iuml;&#239;
¤&curren;&#164;ð&eth;&#240;
¥&yen;&#165;ñ&ntilde;&#241;
¦&brvbar;&#166;ò&ograve;&#242;
§&sect;&#167;ó&oacute;&#243;
¨&uml;&#168;ô&ocirc;&#244;
©&copy;&#169;õ&otilde;&#245;
ª&ordf;&#170;ö&ouml;&#246;
«&laquo;&#171;÷&divide;&#247;
¬&not;&#172;ø&oslash;&#248;
­&shy;&#173;ù&ugrave;&#249;
®&reg;&#174;ú&uacute;&#250;
¯&macr;&#175;û&ucirc;&#251;
°&deg;&#176;ü&uuml;&#252;
±&plusmn;&#177;ý&yacute;&#253;
²&sup2;&#178;þ&thorn;&#254;
³&sup3;&#179;ÿ&yuml;&#255;
´&acute;&#180;ƒ&fnof;&#402;
µ&micro;&#181;Α&Alpha;&#913;
&para;&#182;Β&Beta;&#914;
·&middot;&#183;Γ&Gamma;&#915;
¸&cedil;&#184;Δ&Delta;&#916;
¹&sup1;&#185;Ε&Epsilon;&#917;
º&ordm;&#186;Ζ&Zeta;&#918;
»&raquo;&#187;Η&Eta;&#919;
¼&frac14;&#188;Θ&Theta;&#920;
½&frac12;&#189;Ι&Iota;&#921;
¾&frac34;&#190;Κ&Kappa;&#922;
¿&iquest;&#191;Λ&Lambda;&#923;
À&Agrave;&#192;Μ&Mu;&#924;
Á&Aacute;&#193;Ν&Nu;&#925;
Â&Acirc;&#194;Ξ&Xi;&#926;
Ã&Atilde;&#195;Ο&Omicron;&#927;
Ä&Auml;&#196;Π&Pi;&#928;
Å&Aring;&#197;Ρ&Rho;&#929;
Æ&AElig;&#198;Σ&Sigma;&#931;
Ç&Ccedil;&#199;Τ&Tau;&#932;
È&Egrave;&#200;Υ&Upsilon;&#933;
É&Eacute;&#201;Φ&Phi;&#934;
Ê&Ecirc;&#202;Χ&Chi;&#935;
Ë&Euml;&#203;Ψ&Psi;&#936;
Ì&Igrave;&#204;Ω&Omega;&#937;
Í&Iacute;&#205;α&alpha;&#945;
Î&Icirc;&#206;β&beta;&#946;
Ï&Iuml;&#207;γ&gamma;&#947;
Ð&ETH;&#208;δ&delta;&#948;
Ñ&Ntilde;&#209;ε&epsilon;&#949;
Ò&Ograve;&#210;ζ&zeta;&#950;
Ó&Oacute;&#211;η&eta;&#951;
Ô&Ocirc;&#212;θ&theta;&#952;
Õ&Otilde;&#213;ι&iota;&#953;
Ö&Ouml;&#214;κ&kappa;&#954;
×&times;&#215;λ&lambda;&#955;
Ø&Oslash;&#216;μ&mu;&#956;
Ù&Ugrave;&#217;ν&nu;&#957;
Ú&Uacute;&#218;ξ&xi;&#958;
Û&Ucirc;&#219;ο&omicron;&#959;
Ü&Uuml;&#220;π&pi;&#960;
Ý&Yacute;&#221;ρ&rho;&#961;
Þ&THORN;&#222;ς&sigmaf;&#962;
ß&szlig;&#223;σ&sigma;&#963;
à&agrave;&#224;τ&tau;&#964;
á&aacute;&#225;υ&upsilon;&#965;
â&acirc;&#226;φ&phi;&#966;
ã&atilde;&#227;χ&chi;&#967;
ä&auml;&#228;ψ&psi;&#968;
å&aring;&#229;ω&omega;&#969;
æ&aelig;&#230;ϑ&thetasym;&#977;
ç&ccedil;&#231;ϒ&upsih;&#978;
è&egrave;&#232;ϖ&piv;&#982;

特殊符号

字符名称编号字符名称编号
&bull;&#8226;&infin;&#8734;
&hellip;&#8230;&ang;&#8736;
&prime;&#8242;&and;&#8743;
&Prime;&#8243;&or;&#8744;
&oline;&#8254;&cap;&#8745;
&frasl;&#8260;&cup;&#8746;
&weierp;&#8472;&int;&#8747;
&image;&#8465;&there4;&#8756;
&real;&#8476;&sim;&#8764;
&trade;&#8482;&cong;&#8773;
&alefsym;&#8501;&asymp;&#8776;
&larr;&#8592;&ne;&#8800;
&uarr;&#8593;&equiv;&#8801;
&rarr;&#8594;&le;&#8804;
&darr;&#8595;&ge;&#8805;
&harr;&#8596;&sub;&#8834;
&crarr;&#8629;&sup;&#8835;
&lArr;&#8656;&nsub;&#8836;
&uArr;&#8657;&sube;&#8838;
&rArr;&#8658;&supe;&#8839;
&dArr;&#8659;&oplus;&#8853;
&hArr;&#8660;&otimes;&#8855;
&forall;&#8704;&perp;&#8869;
&part;&#8706;&sdot;&#8901;
&exist;&#8707;&lceil;&#8968;
&empty;&#8709;&rceil;&#8969;
&nabla;&#8711;&lfloor;&#8970;
&isin;&#8712;&rfloor;&#8971;
&notin;&#8713;&lang;&#9001;
&ni;&#8715;&rang;&#9002;
&prod;&#8719;&loz;&#9674;
&sum;&#8721;&spades;&#9824;
&minus;&#8722;&clubs;&#9827;
&lowast;&#8727;&hearts;&#9829;
&radic;&#8730;&diams;&#9830;
&prop;&#8733;

HTML转义字符 123.5ikfc.com/html/character.html

转义字符串程序代码

使用Python可以很方便的将字符串转换成转义字符串,只需要两行代码:

import html
print(html.escape('<a href="http://123.5ikfc.com">123.5ikfc.com</a>'))

输出结果如下:

&lt;a href=&quot;http://123.5ikfc.com&quot;&gt;123.5ikfc.com&lt;/a&gt;

使用Javascript可以通过innerText和innerHTML属性返回转义字符串:

function htmlEntities(html){
 var text = document.createTextNode(html);
 var p = document.createElement('p');
 p.appendChild(text);
 return p.innerHTML;
}

此函数可以返回转义后的字符串,但是引号不会被转义,如果有需要可以对返回结果replace处理一下即可。