HTML Entities

Special characters in HTML

🔤 What are HTML Entities?

HTML entities are special codes used to display characters that have special meaning in HTML or characters that can't be typed easily. 


<!-- Using entities for special characters -->
<p>The price is &lt; $100 &amp; it's great!</p>
<!-- Displays: The price is < $100 & it's great! -->

Common HTML Entities

<

Less Than

&lt; displays < 

&lt;
>

Greater Than

&gt; displays > 

&gt;
&

Ampersand

&amp; displays & 

&amp;
"

Quote

&quot; displays " 

&quot;

🔹 Essential HTML Entities

These entities help you display HTML characters safely: 

<!-- Showing HTML code in text -->
<p>To create a heading, use &lt;h1&gt;Your Title&lt;/h1&gt;</p>

<!-- Showing special characters -->
<p>Price: $50 &amp; up</p>
<p>He said &quot;Hello!&quot;</p>

<!-- Non-breaking space -->
<p>Keep&nbsp;these&nbsp;words&nbsp;together</p>

Output:

To create a heading, use <h1>Your Title</h1>

Price: $50 & up

He said "Hello!"

Keep these words together

🔹 Useful Symbol Entities

Common symbols you can use in your web pages: 

<!-- Copyright and trademark -->
<p>&copy; 2024 My Company</p>
<p>Brand Name&trade;</p>
<p>Registered&reg;</p>

<!-- Currency -->
<p>Price: &euro;50 or &pound;40</p>

<!-- Math symbols -->
<p>2 &times; 3 = 6</p>
<p>10 &divide; 2 = 5</p>

Output:

© 2024 My Company

Brand Name™

Registered®

Price: €50 or £40

2 × 3 = 6

10 ÷ 2 = 5

🔹 Entity Reference Table

Quick reference for common entities:

Character Entity Description
< &lt; Less than
> &gt; Greater than
& &amp; Ampersand
" &quot; Quote
© &copy; Copyright

🧠 Test Your Knowledge

Which entity displays the < character?