HTML Entities

    All the HTML coding characters such as <, >, / etc. are reserved andd when we want to display these reserved characters as a content text, then we use the HTML entities.

    HTML Entities

    There are some reserved characters in HTML, so when we want to represent those character as a regular text, we need to use HTML entities. Entities provide an alternative method to display HTML reserved keyword. When we want to display a reserved keyword, we always use its corresponding entity, because, the browser may confuse the standard text with its reserved keywords.

    Example: 

    <p>  &lt; </p>

    Output: 

    <

    Every HTML reserved keyword has its corresponding entity name and number. We can either use name or number to represent the entity.

    Example; 

    <p> &ampl </p> 
<p> &#60 </p>

    Output: 

    &
&

    Entities are also used to display special characters that are not present on the regular keyboards.

    Example: 

    <p> &reg; </p>

    Output 

    ®

    HTML Entities Examples

    There are many entities present in HTML; some of the common ones are:

    Non-Breaking Space (&nbsp; , &#160;)

    By default, HTML provides single spacing between the textual content. But if you want to put more than one space between the text, then you can use the non-breaking space entity. The &nbsp; entity is used to put a space between the text.

    Example 

    <p> Hello &nbsp; &nbsp; &nbsp; &nbsp; World</p>

    Output 

    Hello       World

    Less than < (&lt; ,  &#60)

    The angular bracket or less than sign is often used to represent the tag names. So when you want to describe it as text content, you should use its entity version.

    Example 

    <p> 2 &lt; 3 </p>
<p> 200 &#60; 400  </p>

    Output 

    2 < 3 200 < 400

    Greater Than > (&gt; , &#62;)

    Greater than symbol is also used in writing the tag. So it is a good practice to write its entity version when displaying it as a text.

    Example; 

    <p> 23 &gt; 13 </p> 
<p> 450 &#62; 400 </p>

    Output: 

    23 > 13 450 > 400

    cent ¢ Symbol (&cent; , &#162; )

    HTML entities are also used to represent special characters like currency unit, trademarks and other symbols.

    Example 

    <p> &cent; 20 </p>

    Output 

    ¢ 20

    Copyright © (&copy; , &#169)

    Every webpage contains a copyright symbol, and this symbol is created using HTML entity.

    Example 

    <p> &copy; 2017-20 </p>

    Output 

    © 2017-20

    Useful HTML Character Entities

    Symbol Entity Name Entity Number
    &nbsp; &#160;
    < &lt; &#60;
    > &gt; &#62;
    & &amp; &#38;
    " &quot; &#34;
    ' &apos; &#39;
    ¢ &cent; &#162;
    £ &pound; &#163;
    ¥ &yen; &#165;
    € &euro; &#8364;
    © &copy; &#169;
    ® &reg; &#174;

    <Note> Entities are case sensitive, &copy; and &CopY; would not give the same result.

    Summary

    • Entities are used to display HTML reserved characters.
    • Using entities, we can also display special characters that are not present on keyboards.
    • To provide spacing between two characters, we use &nbsp; entity.
    • An entity character can either be represented by its name or number.
    • Entities are case sensitive.
    Previous Tutorial