NỘI DUNG BÀI VIẾT
HTML Entity
Có một vài ký tự đặc biệt mà nếu nó xuất hiện trong một tài liệu HTML có thể gây hiểu nhầm cho bộ máy phân tích nguồn HTML (HTML source parser), chẳng hạn ký tự “nhỏ hơn” ( < ), khi gặp ký tự này bộ máy phân tích HTML có hiểu nhầm là nó đang bắt gặp một thẻ. Để tránh hiểu nhầm này, HTML sử dụng thực thể (HTML entity) < để thay thế cho ký tự ( < ).Dưới đây là một vài ký tự thông dụng cần được thay thế bởi các thực thể (entity), danh sách đầy đủ bạn có thể xem ở phía cuối của bài viết này.
| Ký tự | Mô tả | Thực thể |
|---|---|---|
| Dấu cách không ngắt dòng (Non-breaking Space) | | |
| < | Nhỏ hơn | < |
| > | Lớn hơn | > |
| & | Ký tự dấu và (ampersand) | & |
| “ | Nháy kép (Double quotation mark) | " |
| ‘ | Nháy đơn (Single quotation mark) (apostrophe) | ' |
Hãy xem một tài liệu HTML với sự xuất hiện của các thực thể và kết quả mà bạn nhìn thấy trên trình duyệt.
<!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/>
<h1>, <h2>, <h3>, <h4>, <h5>, <h6>
</body>
</html>
Kết quả:
Ngoài các thực thể đại diện cho các ký tự có thể gây hiểu nhầm nói trên, có một danh sách rất nhiều các thực thể đại diện cho các ký tự đặc biệt khác ( £ § ¢ ¥ © … )
| Character | Description | Entity Name |
| ¢ | cent | ¢ |
| £ | pound | £ |
| ¥ | yen | ¥ |
| § | section | § |
| © | copyright | © |
| ® | registered trademark | ® |
Chú ý: Bạn có thể tìm thấy danh sách đầy đủ các thực thể HTML ở phía cuối của bài viết này.
Entity Name vs Entity Number
Có hai cách để bạn đề cập tới một thực thể đó là sử dụng “Tên của thực thể” hoặc sử dụng “Mã số của thực thể”. Chẳng hạn để đề cập tới ký tự nhỏ hơn ( < ) bạn có thể sử dụng tên thực thể ( < ) hoặc sử dụng mã số thực thể ( < ).
&entity_name;
&#entity_number;Code language: CSS (css)Ưu điểm của việc sử dụng tên thực thể (entity name) đó là dễ nhớ. Nhưng nhược điểm là một số trình duyệt có thể không hỗ trợ đầy đủ tất cả tên các thực thể, nhưng chúng hỗ trợ một cách đầy đủ mã số của các thực thể.
| Display | Description | Entity Name | Entity Number |
|---|---|---|---|
| Non-breaking space | |   | |
| < | Less than | < | < |
| > | Greater than | > | > |
| & | Ampersand | & | & |
| “ | Double quotation mark | " | " |
| ‘ | Single quotation mark (apostrophe) | ' | ' |
Chú ý: Bạn có thể tra cứu danh sách các thực thể với tên và mã số đầy đủ ở phía cuối của bài viết này.
Non-breaking Space ( )
Thực thể được sử dụng để thay thế cho “dấu cách không bị ngắt dòng” (Non-breaking space). Để dễ hiểu bạn có thể xem hình minh họa dưới đây:
Danh sách các thực thể
ISO 8859-1 Symbol HTML Entity
| Display | Description | Entity Name | Number Code |
|---|---|---|---|
| non-breaking space | |   | |
| ¡ | inverted exclamation mark | ¡ | ¡ |
| ¤ | currency | ¤ | ¤ |
| ¢ | cent | ¢ | ¢ |
| £ | pound | £ | £ |
| ¥ | yen | ¥ | ¥ |
| ¦ | broken vertical bar | ¦ | ¦ |
| § | section | § | § |
| ¨ | spacing diaeresis | ¨ | ¨ |
| © | copyright | © | © |
| ª | feminine ordinal indicator | ª | ª |
| « | angle quotation mark (left) | « | « |
| ¬ | negation | ¬ | ¬ |
| | soft hyphen | ­ | ­ |
| ® | registered trademark | ® | ® |
| ™ | trademark | ™ | ™ |
| ¯ | spacing macron | ¯ | ¯ |
| ° | degree | ° | ° |
| ± | plus-or-minus | ± | ± |
| ² | superscript 2 | ² | ² |
| ³ | superscript 3 | ³ | ³ |
| ´ | spacing acute | ´ | ´ |
| µ | micro | µ | µ |
| ¶ | paragraph | ¶ | ¶ |
| · | middle dot | · | · |
| ¸ | spacing cedilla | ¸ | ¸ |
| ¹ | superscript 1 | ¹ | ¹ |
| º | masculine ordinal indicator | º | º |
| » | angle quotation mark (right) | » | » |
| ¼ | fraction 1/4 | ¼ | ¼ |
| ½ | fraction 1/2 | ½ | ½ |
| ¾ | fraction 3/4 | ¾ | ¾ |
| ¿ | inverted question mark | ¿ | ¿ |
| × | multiplication | × | × |
| ÷ | division | ÷ | ÷ |
ISO 8859-1 Character HTML Entity
| Display | Description | Entity Name | Number Code |
|---|---|---|---|
| À | capital a, grave accent | À | À |
| Á | capital a, acute accent | Á | Á |
| Â | capital a, circumflex accent | Â | Â |
| Ã | capital a, tilde | Ã | Ã |
| Ä | capital a, umlaut mark | Ä | Ä |
| Å | capital a, ring | Å | Å |
| Æ | capital ae | Æ | Æ |
| Ç | capital c, cedilla | Ç | Ç |
| È | capital e, grave accent | È | È |
| É | capital e, acute accent | É | É |
| Ê | capital e, circumflex accent | Ê | Ê |
| Ë | capital e, umlaut mark | Ë | Ë |
| Ì | capital i, grave accent | Ì | Ì |
| Í | capital i, acute accent | Í | Í |
| Î | capital i, circumflex accent | Î | Î |
| Ï | capital i, umlaut mark | Ï | Ï |
| Ð | capital eth, Icelandic | Ð | Ð |
| Ñ | capital n, tilde | Ñ | Ñ |
| Ò | capital o, grave accent | Ò | Ò |
| Ó | capital o, acute accent | Ó | Ó |
| Ô | capital o, circumflex accent | Ô | Ô |
| Õ | capital o, tilde | Õ | Õ |
| Ö | capital o, umlaut mark | Ö | Ö |
| Ø | capital o, slash | Ø | Ø |
| Ù | capital u, grave accent | Ù | Ù |
| Ú | capital u, acute accent | Ú | Ú |
| Û | capital u, circumflex accent | Û | Û |
| Ü | capital u, umlaut mark | Ü | Ü |
| Ý | capital y, acute accent | Ý | Ý |
| Þ | capital THORN, Icelandic | Þ | Þ |
| ß | small sharp s, German | ß | ß |
| à | small a, grave accent | à | à |
| á | small a, acute accent | á | á |
| â | small a, circumflex accent | â | â |
| ã | small a, tilde | ã | ã |
| ä | small a, umlaut mark | ä | ä |
| å | small a, ring | å | å |
| æ | small ae | æ | æ |
| ç | small c, cedilla | ç | ç |
| è | small e, grave accent | è | è |
| é | small e, acute accent | é | é |
| ê | small e, circumflex accent | ê | ê |
| ë | small e, umlaut mark | ë | ë |
| ì | small i, grave accent | ì | ì |
| í | small i, acute accent | í | í |
| î | small i, circumflex accent | î | î |
| ï | small i, umlaut mark | ï | ï |
| ð | small eth, Icelandic | ð | ð |
| ñ | small n, tilde | ñ | ñ |
| ò | small o, grave accent | ò | ò |
| ó | small o, acute accent | ó | ó |
| ô | small o, circumflex accent | ô | ô |
| õ | small o, tilde | õ | õ |
| ö | small o, umlaut mark | ö | ö |
| ø | small o, slash | ø | ø |
| ù | small u, grave accent | ù | ù |
| ú | small u, acute accent | ú | ú |
| û | small u, circumflex accent | û | û |
| ü | small u, umlaut mark | ü | ü |
| ý | small y, acute accent | ý | ý |
| þ | small thorn, Icelandic | þ | þ |
| ÿ | small y, umlaut mark | ÿ | ÿ |
Các thực thể khác được hỗ trợ bởi các trình duyệt
| Display | Description | Entity Name | Number Code |
|---|---|---|---|
| Π| capital ligature OE | Π| Π|
| œ | small ligature oe | œ | œ |
| Š | capital S with caron | Š | Š |
| š | small S with caron | š | š |
| Ÿ | capital Y with diaeres | Ÿ | Ÿ |
| ˆ | modifier letter circumflex accent | ˆ | ˆ |
| ˜ | small tilde | ˜ | ˜ |
| en space |   |   | |
| em space |   |   | |
| thin space |   |   | |
| | zero width non-joiner | ‌ | ‌ |
| | zero width joiner | ‍ | ‍ |
| | left-to-right mark | ‎ | ‎ |
| | right-to-left mark | ‏ | ‏ |
| – | en dash | – | – |
| — | em dash | — | — |
| ‘ | left single quotation mark | ‘ | ‘ |
| ’ | right single quotation mark | ’ | ’ |
| ‚ | single low-9 quotation mark | ‚ | ‚ |
| “ | left double quotation mark | “ | “ |
| ” | right double quotation mark | ” | ” |
| „ | double low-9 quotation mark | „ | „ |
| † | dagger | † | † |
| ‡ | double dagger | ‡ | ‡ |
| … | horizontal ellipsis | … | … |
| ‰ | per mille | ‰ | ‰ |
| ‹ | single left-pointing angle quotation | ‹ | ‹ |
| › | single right-pointing angle quotation | › | › |
| € | euro | € | € |
Kết luận
Qua đây là một số chia sẻ về HTML Entity, mời bạn tiếp tục theo dõi các bài viết sau để hiểu rõ hơn về HTML.
Các bạn có thể tham khảo các bài viết hay về HTML tại đây.
Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.
