Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.
The HTML element renders everything following the start tag as raw text, ignoring any following HTML. There is no closing tag, since everything after it is considered raw text.
Warning: Do not use this element.
is deprecated since HTML 2, and not all browsers implemented it. Browsers that did implement it didn't do so consistently.
is obsolete; browsers that accept it may instead treat it as a
element that still interprets HTML within.
- If
is the first element on the page [other than any non-displayed elements, like
], do not use HTML at all. Instead serve a text file with the
text/plain
MIME-type. - Instead of
, use the
element or, if semantically accurate [such as for inline text], the
element. Escape any
0,
1 and
2 characters, to prevent browsers inadvertently parsing content the element content as HTML.
- A monospaced font can be applied to any HTML element via a CSS
3 style with the
4 generic value.
This element has no other attributes than the global attributes common to all elements.
This element implements the 5 interface.
BCD tables only load in the browserwith JavaScript enabled. Enable JavaScript to view data.
- The
and
elements, which should be used instead.
- The
8 and
9 elements, which are both obsolete elements similar to
.
Found a content problem with this page?
- Edit the page on Github.
- Report the content issue.
- View the source on GitHub.
This page was last modified on Jan 18, 2023 by MDN contributors.
I want to display to the user a plain HTML snippet, but whenever I'm trying its automatically being rendered as HTML without the tags.
I want to display the following,
This is a paragraph
But its rendering
This is a paragraph
How to display the plain code?
Normally, HTML tags are not visible to the end-user because they are used to render the content of the page.
However, you can still display the tags on the page anyway if you make sure of HTML entities.
HTML entities are a way to display certain characters in HTML. In our case, we need a way to display the characters, because these are reserved characters in HTML.
Because they have special meaning in HTML, they are not usually displayed as plain text.
Here's an example of using HTML entities to display HTML tags:
<h1>This is a heading.</h1>
<ul>
<li>This is a list item.</li>
</ul>
<ol>
<li>This is a list item.</li>
</ol>
This is how it will look like rendered in the browser:
This is a heading.
- This is a list item.
- This is a list item.
Here is a list of all the reserved HTML characters and their entities:
:
>
&
:This is a heading.
- This is a list item.
- This is a list item.
This is a heading.
- This is a list item.
- This is a list item.
This is a heading.
- This is a list item.
- This is a list item.
Every entity starts with &
and ends with
This is a heading.
- This is a list item.
- This is a list item.
4.To encode your HTML, you can use a search and replace for every reserved character to convert it to its corresponding entity.
Once you encode your HTML, you will want to preserve the formatting and indentation of the HTML.
To do this, use the
This is a heading.
- This is a list item.
- This is a list item.
5 tag. This tag is used on on preformatted text, hence the name.Here's an example of how to use the
This is a heading.
- This is a list item.
- This is a list item.
5 tag with encoded HTML:
<h1>This is a heading.</h1>
<ul>
<li>This is a list item.</li>
</ul>
<ol>
<li>This is a list item.</li>
</ol>
We've seen how to display HTML tags as plain text using HTML entities. We've also seen how to use the
This is a heading.
- This is a list item.
- This is a list item.
7 tag to preserve the formatting and indentation of HTML.Hopefully, you've found this post helpful!
If you want to learn about web development, founding a start-up, bootstrapping a SaaS, and more, follow me on Twitter! You can also join the conversation over at our official Discord!