Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ideas on how to display/present HTML tags on a webpage

Tags:

html

css

tags

Is there a way to write HTML onto a webpage, but have it rendered as text?

Let me explain: I want to build a webpage with a discussion on HTML. Therefore there will be sections like

<div>
    <p>
        <span>Hello world</span>
    </p>
</div>

I would like that to formatted properly with indentation, and perhaps even have the tags in a different colour scheme.

I'm fully aware that I could write the styling for this myself, but surely someone has already written and made available a stylesheet, a LESS mixin, or perhaps a jQuery plugin which recognises and formats for me?

UPDATE: Just to make people aware, I realise that I have to HTML-encode the tags (&lt; and &gt;). But that doesn't help with the formatting/presentation, and it's the formatting/presentation that I'm looking for help with.

like image 220
awj Avatar asked Dec 09 '11 09:12

awj


People also ask

How do you show tags on a website?

You can show HTML tags as plain text in HTML on a website or webpage by replacing < with &lt; or &60; and > with &gt; or &62; on each HTML tag that you want to be visible. Ordinarily, HTML tags are not visible to the reader on the browser.

How do I display HTML code without executing?

Use HTML Special Character Codes var myCode = "<b>This is not bold</b>"; $('span#code-span'). text(myCode); Using text instead of html will cause tags to be rendered exposed instead of being executed.

Which HTML tag is used to display in webpage?

Images can be displayed on an HTML page with the help of the <img> tag.


1 Answers

Use the <xmp> tag instead of <pre>.

E.g.

<xmp>

<html>
<body>This is my html inside html.</body>
</html>

</xmp>
like image 59
Fuzzy Analysis Avatar answered Oct 18 '22 20:10

Fuzzy Analysis