HTML Entities

HTML Tutorial

HTML Entities

HTML Entities are special codes used to display reserved characters, symbols, or invisible spaces in HTML that would otherwise be interpreted as code.

 1. Why HTML Entities Are Needed

Some characters have special meaning in HTML, like:

  • < and > → used for tags

  • & → starts an entity

If you write them directly, the browser may misinterpret them.

 Problem

 Correct (Using Entity)


 2. HTML Entity Syntax

HTML entities have two formats:

 Named Entity

&entityName;

 Numeric Entity

&#entityNumber;

Both end with a semicolon (;).


 3. Common Entities (Must Know)

CharacterEntityDescription
<&lt;Less than
>&gt;Greater than
&&amp;Ampersand
"&quot;Double quote
'&apos;Single quote
©&copy;Copyright
®&reg;Registered
&trade;Trademark

 4. Non-Breaking Space (&nbsp;)

Used to create extra spaces that won’t collapse or break lines.

  • Useful for spacing
  • Don’t overuse for layout (use CSS instead)

 5. Currency Symbols

₹ → &#8377;
$ → &dollar;
€ → &euro;
£ → &pound;

Example:


 6. Mathematical Symbols

× → &times;
÷ → &divide;
± → &plusmn;
∞ → &infin;

Example:


 7.  Entities for Quotes (Important for Attributes)

  •  Prevents attribute break

8. Emojis Using Entities

😀 → &#128512;
❤️ → &#10084;

Example:


 9. Displaying HTML Code as Text

To show HTML code on a webpage:

Output:

  •  Very useful for tutorials

 Common Mistakes

  •  Forgetting semicolon (;)
  • Using entities unnecessarily
  •  Using &nbsp; for layout
  • Writing < or & directly in text

 Key Points to Remember

  • Entities display reserved & special characters

  • Always end entities with ;

  • Use &lt; and &gt; for < >

  • Use &amp; for &

  • Use CSS for spacing, not &nbsp;

You may also like...