devstory

Le Tutoriel de HTML Entity

  1. HTML Entity
  2. Entity Name vs Entity Number
  3. Non-breaking Space ( )
  4. Liste des entités

1. HTML Entity

Il y a quelques caractères spéciaux qui s'ils apparaissent dans un document HTML, peuvent causer des malentendus dans l'analyseur de source HTML. Par exemple, lorsque l'analyseur de source HTML rencontre le caractère "plus petit" (<), il peut confondre le caractère avec une balise. Par conséquent, pour éviter tout malentendu, HTML utilise l'entité &lt; à la place du caractère ( <)).
Voici quelques caractères communs qui doivent être remplacés par des entités (entity). A propos de la liste complète, vous pouvez la voir à la fin de cet article.
Caractère
Description
Nom Entité
Espace incassable (Non-breaking Space)
<
Moins de
&lt;
>
Supérieur à
&gt;
&
Esperluette (ampersand)
&amp;
"
Guillemets(Double quotation mark)
&quot;
'
Guillemets simples (Single quotation mark) (apostrophe)
&apos;
Jetez un coup d'œil à un document HTML avec la présence d'entités et les résultats que vous voyez dans le navigateur.
entity-example.html
<!DOCTYPE html>
<html>
<head>
    <title>Entities</title>
    <meta charset="UTF-8">
</head>
<body>
    <h3>Entities example:</h3>
    HTML defines six levels of headings. <br/>
    The heading elements are: <br/><br/>
    &lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;, &lt;h4&gt;, &lt;h5&gt;, &lt;h6&gt; 
</body>
</html>
En plus des entités représentant les caractères erronés mentionnés ci-dessus, il existe une liste de nombreuses entités représentant d'autres caractères spéciaux (£ § ¢ ¥ ©...).
Character
Description
Entity Name
¢
cent
&cent;
£
pound
&pound;
¥
yen
&yen;
§
section
&sect;
©
copyright
&copy;
®
registered trademark
&reg;
Note : Vous pouvez voir la liste complète des entités HTML à la fin de cet article.

2. Entity Name vs Entity Number

Il y a deux façons de se référer à une entité. L'une consiste à utiliser le "Nom de l'entité" et l'autre, le "Numéro de l'entité". Par exemple, pour faire référence au caractère (<), vous pouvez éventuellement utiliser le nom de l'entité ( &lt; ) ou le numéro de l'entité ( &#60; ).
&entity_name;

&#entity_number;
L'avantage d'utiliser un nom d'entité (entity name) est qu'il est facile à retenir. Cependant, l'inconvénient est que certains navigateurs peuvent ne pas prendre en charge tous les noms d'entités, alors qu'ils prennent entièrement en charge les numéros d'entités.
Display
Description
Entity Name
Entity Number
Non-breaking space
&#160;
<
Less than
&lt;
&#60;
>
Greater than
&gt;
&#62;
&
Ampersand
&amp;
&#38;
"
Double quotation mark
&quot;
&#34;
'
Single quotation mark (apostrophe)
&apos;
&#39;
Remarque : Vous trouverez la liste complète des entités HTML avec leurs noms et numéros à la fin de cet article.

3. Non-breaking Space (&nbsp;)

L'entité est utilisé pour remplacer l'espace insécable (Non-breaking space). Permettez-moi de donner un exemple pour illustrer ce point :
non-breaking-space-example.html
<p style="font-size:40px">
    This&nbsp;is&nbsp;a&nbsp;non&nbsp;breaking&nbsp;Sentence&nbsp;&nbsp;&nbsp;!!
</p>
<p style="font-size:40px">
    This sentence will be line breaks.
</p>

4. Liste des entités

ISO 8859-1 Symbol Entities
Display
Description
Entity Name
Number Code
non-breaking space
&#160;
¡
inverted exclamation mark
&iexcl;
&#161;
¤
currency
&curren;
&#164;
¢
cent
&cent;
&#162;
£
pound
&pound;
&#163;
¥
yen
&yen;
&#165;
¦
broken vertical bar
&brvbar;
&#166;
§
section
&sect;
&#167;
¨
spacing diaeresis
&uml;
&#168;
©
copyright
&copy;
&#169;
ª
feminine ordinal indicator
&ordf;
&#170;
«
angle quotation mark (left)
&laquo;
&#171;
¬
negation
&not;
&#172;
soft hyphen
&shy;
&#173;
®
registered trademark
&reg;
&#174;
™
trademark
&trade;
&#8482;
¯
spacing macron
&macr;
&#175;
°
degree
&deg;
&#176;
±
plus-or-minus
&plusmn;
&#177;
²
superscript 2
&sup2;
&#178;
³
superscript 3
&sup3;
&#179;
´
spacing acute
&acute;
&#180;
µ
micro
&micro;
&#181;
paragraph
&para;
&#182;
·
middle dot
&middot;
&#183;
¸
spacing cedilla
&cedil;
&#184;
¹
superscript 1
&sup1;
&#185;
º
masculine ordinal indicator
&ordm;
&#186;
»
angle quotation mark (right)
&raquo;
&#187;
¼
fraction 1/4
&frac14;
&#188;
½
fraction 1/2
&frac12;
&#189;
¾
fraction 3/4
&frac34;
&#190;
¿
inverted question mark
&iquest;
&#191;
×
multiplication
&times;
&#215;
÷
division
&divide;
&#247;
ISO 8859-1 Character Entities
Display
Description
Entity Name
Number Code
À
capital a, grave accent
&Agrave;
&#192;
Á
capital a, acute accent
&Aacute;
&#193;
Â
capital a, circumflex accent
&Acirc;
&#194;
Ã
capital a, tilde
&Atilde;
&#195;
Ä
capital a, umlaut mark
&Auml;
&#196;
Å
capital a, ring
&Aring;
&#197;
Æ
capital ae
&AElig;
&#198;
Ç
capital c, cedilla
&Ccedil;
&#199;
È
capital e, grave accent
&Egrave;
&#200;
É
capital e, acute accent
&Eacute;
&#201;
Ê
capital e, circumflex accent
&Ecirc;
&#202;
Ë
capital e, umlaut mark
&Euml;
&#203;
Ì
capital i, grave accent
&Igrave;
&#204;
Í
capital i, acute accent
&Iacute;
&#205;
Î
capital i, circumflex accent
&Icirc;
&#206;
Ï
capital i, umlaut mark
&Iuml;
&#207;
Ð
capital eth, Icelandic
&ETH;
&#208;
Ñ
capital n, tilde
&Ntilde;
&#209;
Ò
capital o, grave accent
&Ograve;
&#210;
Ó
capital o, acute accent
&Oacute;
&#211;
Ô
capital o, circumflex accent
&Ocirc;
&#212;
Õ
capital o, tilde
&Otilde;
&#213;
Ö
capital o, umlaut mark
&Ouml;
&#214;
Ø
capital o, slash
&Oslash;
&#216;
Ù
capital u, grave accent
&Ugrave;
&#217;
Ú
capital u, acute accent
&Uacute;
&#218;
Û
capital u, circumflex accent
&Ucirc;
&#219;
Ü
capital u, umlaut mark
&Uuml;
&#220;
Ý
capital y, acute accent
&Yacute;
&#221;
Þ
capital THORN, Icelandic
&THORN;
&#222;
ß
small sharp s, German
&szlig;
&#223;
à
small a, grave accent
&agrave;
&#224;
á
small a, acute accent
&aacute;
&#225;
â
small a, circumflex accent
&acirc;
&#226;
ã
small a, tilde
&atilde;
&#227;
ä
small a, umlaut mark
&auml;
&#228;
å
small a, ring
&aring;
&#229;
æ
small ae
&aelig;
&#230;
ç
small c, cedilla
&ccedil;
&#231;
è
small e, grave accent
&egrave;
&#232;
é
small e, acute accent
&eacute;
&#233;
ê
small e, circumflex accent
&ecirc;
&#234;
ë
small e, umlaut mark
&euml;
&#235;
ì
small i, grave accent
&igrave;
&#236;
í
small i, acute accent
&iacute;
&#237;
î
small i, circumflex accent
&icirc;
&#238;
ï
small i, umlaut mark
&iuml;
&#239;
ð
small eth, Icelandic
&eth;
&#240;
ñ
small n, tilde
&ntilde;
&#241;
ò
small o, grave accent
&ograve;
&#242;
ó
small o, acute accent
&oacute;
&#243;
ô
small o, circumflex accent
&ocirc;
&#244;
õ
small o, tilde
&otilde;
&#245;
ö
small o, umlaut mark
&ouml;
&#246;
ø
small o, slash
&oslash;
&#248;
ù
small u, grave accent
&ugrave;
&#249;
ú
small u, acute accent
&uacute;
&#250;
û
small u, circumflex accent
&ucirc;
&#251;
ü
small u, umlaut mark
&uuml;
&#252;
ý
small y, acute accent
&yacute;
&#253;
þ
small thorn, Icelandic
&thorn;
&#254;
ÿ
small y, umlaut mark
&yuml;
&#255;
D'autres entités sont soutenues par les navigateurs.
Display
Description
Entity Name
Number Code
Œ
capital ligature OE
&OElig;
&#338;
œ
small ligature oe
&oelig;
&#339;
Š
capital S with caron
&Scaron;
&#352;
š
small S with caron
&scaron;
&#353;
Ÿ
capital Y with diaeres
&Yuml;
&#376;
ˆ
modifier letter circumflex accent
&circ;
&#710;
˜
small tilde
&tilde;
&#732;
en space
&ensp;
&#8194;
em space
&emsp;
&#8195;
thin space
&thinsp;
&#8201;
‌
zero width non-joiner
&zwnj;
&#8204;
‍
zero width joiner
&zwj;
&#8205;
‎
left-to-right mark
&lrm;
&#8206;
‏
right-to-left mark
&rlm;
&#8207;
–
en dash
&ndash;
&#8211;
—
em dash
&mdash;
&#8212;
‘
left single quotation mark
&lsquo;
&#8216;
’
right single quotation mark
&rsquo;
&#8217;
‚
single low-9 quotation mark
&sbquo;
&#8218;
“
left double quotation mark
&ldquo;
&#8220;
”
right double quotation mark
&rdquo;
&#8221;
„
double low-9 quotation mark
&bdquo;
&#8222;
†
dagger
&dagger;
&#8224;
‡
double dagger
&Dagger;
&#8225;
…
horizontal ellipsis
&hellip;
&#8230;
‰
per mille
&permil;
&#8240;
‹
single left-pointing angle quotation
&lsaquo;
&#8249;
›
single right-pointing angle quotation
&rsaquo;
&#8250;
€
euro
&euro;
&#8364;