bugl
bugl
HomeLearnPatternsPathsSearchPremium
HomeLearnPatternsPaths

Loading lesson path

Learn/HTML/HTML Foundations
HTML•HTML Foundations

HTML Entities

Reserved characters in HTML must be replaced with entities:

  • < (less than) = <
  • > (greater 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 or entity numbers can be used to display reserved HTML characters.

Entity names look like this

&
entity_name
;

Entity numbers look like this

&#
entity_number
;

To display a less than sign (<) we must write: < or &#60;

Entity names are easier to remember than entity numbers.

Non-breaking Space

A commonly used HTML entity is the non-breaking space: &nbsp;

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

Another common use of the non-breaking space is to prevent browsers from truncating spaces in HTML pages.

If you write 10 spaces in your text, the browser will remove 9 of them. To add real spaces to your text, you can use the &nbsp; character entity.

The non-breaking hyphen ( &#8209; ) is used to define a hyphen character (‑) that does not break into a new line.

Some Useful HTML Character Entities

ResultDescriptionNameNumber
non-breaking space&nbsp;&#160;
<less than<&#60;
>greater than>&#62;
&ampersand&&#38;
"double quotation mark"&#34;
'single quotation mark&apos;'
¢cent&cent;&#162;
£pound&pound;&#163;
¥yen&yen;&#165;
€euro&euro;&#8364;
©copyright&copy;&#169;
®registered trademark&reg;&#174;
™trademark&trade;&#8482;

Entity names are case sensitive.

Combining Diacritical Marks

A diacritical mark is a "glyph" added to a letter.

Some diacritical marks, like grave ( ̀) and acute ( ́) are called accents.

Diacritical marks can be used in combination with alphanumeric characters to produce a character that is not present in the character set (encoding) used in the page.

Here are some examples

MarkCharacterConstructResult
̀aa&#768;à
́aa&#769;á
̂aa&#770;â
̃aa&#771;ã
̀OO&#768;Ò
́OO&#769;Ó
̂OO&#770;Ô
̃OO&#771;Õ

There are more examples in the next chapter.

Previous

HTML Style Guide

Next

HTML Symbols