How To Display HTML Code on a Website

I used to think that the PRE html tag would let you type anything and show it as it appears in your source, but it seems like all the PRE tag does is allow you to type spaces without the web browser ignoring it.

Anyways, you can show html code on your page without the browser attempting to render the html object, as shown in the picture below.



All you have to do is change all of your tags brackets from <> to &lt; and &gt;.
The letters lt and gt stand for less than and greater than, as in the convention use of the symbols. So, if you wanted to show someone how to make some text bold and some text italic underneath a picture, you could type:

<div><img src="selfportrait.jpg" alt="A Picture Of Me By Me!" /></div>
<div><b>My Self Portrait</b> - <i>Created By Me</i></div> 

And they would see:

<div><img src="selfportrait.jpg" alt="A Picture Of Me By Me!" /></div>
<div><b>My Self Portrait</b> - <i>Created By Me</i></div>

Another little side note, in order to display &lt; without the browser turning it into a <, you can encode the ampersand the same way we encoded the bracket: &amp;lt;