Display Sample HTML With XMP Tags

If you want to display some sample HTML without rendering it, one old school method is to use the <xmp> </xmp> tag.

The <xmp> tag is intended to be used to display HTML examples – I’m guessing that’s where the name came from. Once the browser sees an opening <xmp>, it stops rendering all HTML until it sees a closing </xmp> tag.

Here’s a bit of sample markup to see how it would work.

<p>Here’s some sample html.</p>
<xmp>
<p>This sentence <strong>won’t</strong> be rendered.
  You should see <em>all</em> of the tags.</p>
</xmp>
<p>At this point, HTML will be rendered again.</p>

The output would look like this…

Here's some sample HTML.
<p>This sentence <strong>won’t</strong> be rendered.
  You should see <em>all</em> of the tags.</p>
At this point, HTML will be rendered again.

It’s simple and effective, but there’s one big catch: it’s a deprecated tag.

The <xmp> tag hasn’t been included in the HTML standards for some time. If you don’t care about being standards compliant, then you can go ahead and use it – chances are it might work.

However, not every browser will render the <xmp> tag correctly. I’ve heard that Opera totally ignores it, and you never know what newer browsers will do with these old tags.

You’d probably be better off with a newer, standards-compliant way to display sample HTML. One method is to use a textarea box and another method is to escape the < and > characters in your HTML.

Go back to the main guide: How to Display Sample HTML

Bookmark and Share:
  • Digg
  • Furl
  • del.icio.us
  • StumbleUpon
  • MisterWong
  • DZone
  • Technorati

8 Comments to “Display Sample HTML With XMP Tags”

  1. free ebooks download said this on August 16th, 2009 at 5:10 am

    Very nice information and well laid out site with some great ebook info – just what i needed! Thanks xox

  2. nieruchomości częstochowa said this on July 11th, 2011 at 9:42 am

    Nice stuff, oki :)

  3. Nikki D. Felder said this on July 23rd, 2011 at 11:48 pm

    I thought I was doing good! I just go to the place where I could write the anchor text html code by memory. Now I read this fantastic post and I’m learning about this xmp. Oh boy!:) I sincerely thank you.

  4. Josh Wineberg said this on July 24th, 2011 at 3:54 am

    Good day! This post could not be written any better! Reading this post reminds me of my previous room mate! He always kept chatting about this. I will forward this write-up to him. Pretty sure he will have a good read. Thank you for sharing!

  5. Edmundo Deisher said this on July 24th, 2011 at 2:57 pm

    My coder is trying to persuade me to move to .net from PHP. I have always disliked the idea because of the expenses. But he’s tryiong none the less. I’ve been using Movable-type on numerous websites for about a year and am concerned about switching to another platform. I have heard very good things about blogengine.net. Is there a way I can transfer all my wordpress content into it? Any help would be really appreciated!

  6. Jae Lasky said this on July 24th, 2011 at 4:10 pm

    Outstanding post however I was wondering if you could write a litte more on this topic? I’d be very grateful if you could elaborate a little bit further. Cheers!

  7. sina88 said this on September 11th, 2011 at 1:19 am

    Just want to say your article is as astonishing. The clearness for your post is just excellent and i could suppose youre knowledgeable on this subject. Well together together with your permission let me to grab your RSS feed to maintain up to date with coming near near post. Thanks one million and please maintain up the gratifying work.

  8. cash said this on January 11th, 2012 at 5:02 pm

    Only wanna comment that you have a very nice site, I like the layout it really stands out.

Leave a Reply