Characters Entity References

Some special keyboard characters and symbols require a little extra care when working with HTML.  As well as HTML and CSS we have character entity references.

Character entities references are the way you put special letters, numbers and symbols on the web page.  A character entity reference consists of an ampersand (&), then a shorthand name for the character and are then closed with a semi-colon (;).

You can also use numeric values for character entity references – some characters only have a numeric value.

Non Breaking Spaces -  

Multiple white space in web pages is created using the   character entity reference.   When reviewing code on other people’s pages you may find something like this.


<p>&nbsp;</p>

This is simply an empty paragraph element with a non-breaking space added.

In some code you might also see:


<p>These &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; are 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; spaced 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; out</p>

In the above the design is using &nbsp; to create a layout effect. This multiple use of &nbsp; is frowned upon. CSS should be used to position content - with my teachers hat on this kind of hack/fudge would definitely lose you marks.

Some Useful Character Entity References

Character Name
© &copy;
® &reg;
&#8482;
Less Than < &lt;
Greater Than > &gt;
Non Breaking Space &nbsp;
Pound Sign £ &pound;
Yen ¥ &yen;
Euro € &euro;

Note: that if you want to use less than or greater than in your text you will need to use character entity references.  This is because they are used to define HTML elements and as such have reserved meaning in a HTML file.

Leave a Comment