bugl
bugl
HomeLearnPatternsPathsSearchPremium
HomeLearnPatternsPaths
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

This chapter

Overview
56

Lessons

191m

Read time

1. HTML Tutorial2. HTML Introduction3. HTML Editors4. HTML Elements5. HTML Attributes6. HTML Headings7. HTML Paragraphs8. HTML Styles9. HTML Text Formatting10. HTML Comments11. HTML Colors12. HTML RGB and RGBA Colors13. HTML HEX Colors14. HTML HSL and HSLA Colors15. HTML Styles - CSS16. HTML Links17. HTML Links - Different Colors18. HTML Links - Create Bookmarks19. HTML Images20. HTML Image Maps21. HTML Background Images22. HTML <picture> Element23. HTML Favicon24. HTML Page Title25. HTML Tables26. HTML Table Borders27. HTML Table Sizes28. HTML Table Headers29. HTML Table Padding & Spacing30. HTML Table Colspan & Rowspan31. HTML Table Styling32. HTML Table Colgroup33. HTML Lists34. HTML Unordered Lists35. HTML Ordered Lists36. HTML Other Lists37. HTML Block and Inline Elements38. HTML Div Element39. HTML class Attribute40. HTML id Attribute41. HTML Buttons42. HTML Iframes43. HTML JavaScript44. HTML File Paths45. HTML - The Head Element46. HTML Layout Elements and Techniques47. HTML Responsive Web Design48. HTML Computer Code Elements49. HTML Semantic Elements50. HTML Style Guide51. HTML Entities52. HTML Symbols53. Using Emojis in HTML54. HTML Encoding (Character Sets)55. HTML Uniform Resource Locators56. HTML Versus XHTML

On this page

HTML Character EntitiesNon-breaking SpaceSome Useful HTML Character EntitiesCombining Diacritical Marks