Lesson 16: HTML Entities & Special Characters

What are HTML Entities?

HTML entities are used to display special characters that are reserved in HTML or not available on your keyboard.

Why Use Entities?

Entity Syntax

Entities start with & and end with ;

Format: &entity_name; or &#entity_number;

Reserved Characters

These characters have special meaning in HTML and must be escaped:

Character Entity Name Entity Number Description
< &lt; &#60; Less than
> &gt; &#62; Greater than
& &amp; &#38; Ampersand
" &quot; &#34; Quotation mark
' &apos; &#39; Apostrophe

Example

To display: <p>Hello</p>
You write: &lt;p&gt;Hello&lt;/p&gt;

Common Symbols

Symbol Entity Name Entity Number Description
© &copy; &#169; Copyright
® &reg; &#174; Registered trademark
™ &trade; &#8482; Trademark
€ &euro; &#8364; Euro
£ &pound; &#163; Pound
¥ &yen; &#165; Yen
¢ &cent; &#162; Cent

Mathematical Symbols

Symbol Entity Name Description
× &times; Multiplication
÷ &divide; Division
± &plusmn; Plus-minus
≠ &ne; Not equal
≤ &le; Less than or equal
≥ &ge; Greater than or equal

Arrows

Symbol Entity Name
← &larr;
→ &rarr;
↑ &uarr;
↓ &darr;

Non-Breaking Space

Use &nbsp; to create a space that won't break into a new line:

10&nbsp;AM (keeps "10" and "AM" together)

Accented Characters

Character Entity Name
á é í ó ú &aacute; &eacute; &iacute; &oacute; &uacute;
à è ì ò ù &agrave; &egrave; &igrave; &ograve; &ugrave;
ñ &ntilde;
ü &uuml;

Practical Examples

<p>&copy; 2025 My Company &trade;</p>
Displays: © 2025 My Company ™

<p>Price: &euro;50</p>
Displays: Price: €50

<p>5 &times; 3 = 15</p>
Displays: 5 × 3 = 15

Emojis

You can also use HTML entities for emojis:

Emoji Entity Number
😀 &#128512;
❤️ &#10084;
⭐ &#11088;
✓ &#10003;

Practice Exercise

Try This:

Create a page that displays: