Uncategorized

How to display HTML code on a webpage

November 24, 2021

How to display HTML code on a webpage

In this article we will learn how to display HTML code on a webpage, that is, the customer who enters your site can see HTML tags, in a very simple and easy way.

display HTML code on a webpage cover

Hey you programmer, okay? Let’s learn something new!

Watch this content on YouTube:

You may have already tried to print tags in HTML, to make a display of how something works, for example

And you came across the interpretation transforming everything into a tag, making you unable to display the pure tags, without them becoming elements

So from now on, your problems are over

To display the HTML tags instead of the element, you must change the opening tag of the ‘<‘ to a code that is &lt;

And the closing symbol, the ‘>’, for the &gt;

These codes are very common in HTML to take the form of some symbol, let’s see an example in practice:

<!DOCTYPE html>
<html>
 <head>
  <title>Como exibir código HTML</title>
  <meta charset="utf-8">
 </head>
 <body>
  <p>Eu quero exibir a tag &lt ;h1&gt ; aqui!</p>
 </body>
</html>

Note: I separated the semicolon from the rest of the code to be displayed correctly in the example, if you do it this way it won’t work, you must join all the code of the symbol

See how this is represented in the browser:

Note that the <h1> tag was displayed correctly, without having transformed the rest of the text into an h1 element

And so we’ve achieved our goal of displaying HTML code on a web page

But as I said before, we have a huge catalog of HTML symbols, such as copyright, which can be done by code: &copy;

For a better understanding of the symbols, visit this site, which contains a large catalog of them

Conclusion

In this article we learned how to display HTML code on a webpage, that is, display tags in HTML pages

For this we use two symbols, one for the opening of the tag and the other for the closing

Which are: &lt; and &gt;

What HTML does is turn these codes into < and > symbols

Want to learn more about HTML? Click here!

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x