HTML Entities

Some characters have special meaning in HTML. The browser might get confused if you use them directly. So we use character entities instead. These are special codes that tell the browser to show the symbol.

What Are HTML Entities?

Characters like < (less than) and > (greater than) are used to write HTML tags. If you want to show these characters on your page, you need to use their entity codes.

There are two types of entity codes:

• Entity names – Like < (easier to remember)
• Entity numbers – Like < (works everywhere)

Without entities, the browser would interpret <p> as a real HTML tag. That would break your page. Entities let you show the characters safely.

The Non-Breaking Space ( )

The non-breaking space ( ) is one of the most used HTML entities. It does two things:

• It adds a space that will NOT break into a new line (words stick together)
• It lets you add multiple spaces (browsers normally collapse multiple spaces into one)

In the example above, the first paragraph shows how browsers collapse multiple normal spaces. The second paragraph uses   to keep all 10 spaces. The third paragraph shows how words stick together and do not break at the end of a line.

Common HTML Entities

Here are the most useful HTML entities you will use regularly:

Using Entities in Practice

Here is a practical example showing how to use entities in a real webpage:

Notice the copyright symbol, the euro and pound signs, and how the <code> text shows as plain text, not as an actual HTML tag.

Entities for Mathematical Symbols

HTML also has entities for mathematical symbols:

Combining Diacritical Marks (Accents)

You can add accents and other marks to letters using combining diacritical marks. These are special codes that combine with the letter before them.

Quick Summary

• Use HTML entities to display reserved characters like < and >
• Entity names like < are easier to remember than numbers like <
• The non-breaking space ( ) prevents line breaks and adds multiple spaces
• Use © for copyright symbol ©
• Use € for euro €, £ for £, ¥ for ¥
• Use < for <, > for >, & for &
• Entity names are case sensitive
• You can use combining diacritical marks to add accents to letters

What Just Happened? Let Me Explain

• HTML entities are essential when you write code examples or show special symbols.
• Without entities, the browser would try to interpret your symbols as HTML code.
• The non-breaking space is very useful for formatting. It is the only way to add multiple spaces in a row.
• Always use entities for user-generated content. If someone types HTML tags in a comment, they should be converted to entities so they do not break your page.
• There are hundreds of HTML entities. You do not need to memorize them all. Just remember the common ones and search for others when you need them.

HTML Entities Reference

Here are the most commonly used HTML entities: