DEV Community

wasifali
wasifali

Posted on

How Entities and Symbols are displayed in HTML

HTML Entities

Reserved characters in HTML must be replaced with entities:
< (less than) = <

(greather than) = >

HTML Character Entities

Some characters are reserved in HTML.
If you use the less than (<) or greater than (>) signs in your HTML text, the browser might mix them with tags.
Entity names look like this:
&entity_name;
Entity numbers look like this:
&#entity_number;
To display a less than sign (<) we must write: < or <
Entity names are easier to remember than entity numbers.

Non-breaking Space

A commonly used HTML entity is the non-breaking space:  
A non-breaking space is a space that will not break into a new line.
Two words separated by a non-breaking space will stick together (not break into a new line). This is handy when breaking the words might be disruptive.

Examples

§ 10
10 km/h
10 PM

Combining Diacritical Marks

A diacritical mark is a "glyph" added to a letter.
Some diacritical marks, like grave ( ̀) and acute ( ́) are called accents.

HTML Symbols

Symbols or letters that are not present on your keyboard can be added to HTML using entities.

HTML Symbol Entities

Many mathematical, technical, and currency symbols, are not present on a normal keyboard.

Example

Display the euro sign:

<p>I will display &euro;</p>
<p>I will display &#8364;</p>
<p>I will display &#x20AC;</p>
The HTML charset Attribute
Enter fullscreen mode Exit fullscreen mode

The character set is specified in the <meta> tag:

Example

<meta charset="UTF-8">
Enter fullscreen mode Exit fullscreen mode

The ASCII Character Set

ASCII was the first character encoding standard for the web. It defined 128 different characters that could be used on the internet:
English letters (A-Z)
Numbers (0-9)
Special characters like ! $ + - ( ) @ < >.
The ANSI Character Set
ANSI was the original Windows character set:
Identical to ASCII for the first 127 characters
Special characters from 128 to 159
Identical to UTF-8 from 160 to 255

<meta charset="Windows-1252">
Enter fullscreen mode Exit fullscreen mode

The ISO-8859-1 Character Set

ISO-8859-1 was the default character set for HTML 4. This character set supported 256 different character codes. HTML 4 also supported UTF-8.
Identical to ASCII for the first 127 characters
Does not use the characters from 128 to 159
Identical to ANSI and UTF-8 from 160 to 255

Example

<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
Enter fullscreen mode Exit fullscreen mode

The UTF-8 Character Set

is identical to ASCII for the values from 0 to 127
Does not use the characters from 128 to 159
Identical to ANSI and 8859-1 from 160 to 255
Continues from the value 256 to 10 000 characters

Example:

<meta charset="UTF-8">
Enter fullscreen mode Exit fullscreen mode

Top comments (0)