FriconiX
Free collection of beautiful vector icons for your web pages.

Lesson 1.3. Special characters in HTML

Syntaxe

When the browser analyses HTML code, each lower sign < is interpreted as the begining of a tag and is not displayed. It then becomes impossible to display the lower sign symbol on a web page. The developers encounter interpretation problems:

The solution to these problems is the use of a special syntax for displaying special characters. The name of the character is surrounded by an ampersand (at the beginning) and a semicolon (at the end):

&symbole_name;

Example

As an example, the following HTML code displays some of the most common special entities:

<!-- Non ordered list of special characters -->
<ul>
    <li>&amp; AMPERSAND</li>
    <li>&lt; LESS THAN</li>
    <li>&gt; GREATE THAN</li>
    <li>&ecirc; CIRCUMFLEX</li>
    <li>&eacute; ACUTE ACCENT</li>
    <li>&egrave; E GRAVE ACCENT</li>
    <li>&agrave; A GRAVE ACCENT</li>
</ul>

The previous code displays the following page when interpreted by the browser:

You will find many sites listing the special characters in HTML. In the following of the course, accents will be deliberately omitted to keep example easy to understand.

Non-Breaking spaces

You may have already noticed that consecutive spaces are replaced by a single space when rendered in the browser. You can compel the browser not to delete a space and prohibit the line feed on this space. The special character & nbsp; displays a non-breakable space. & nbsp; stands for Non-Breaking SPace .

Exercice

Write a HTML code that displays the following HTML tags in the page. Tags must not be rendered as in the following example:

See also


Last update : 01/25/2020