I am using Prettify.js and css for my web site but it is not working for HTML
Let's say I have HTML like this:
<div style="padding:3px 0px">
<asp:Label ID="lblTotalAns" runat="server" Text="0 Answers" CssClass="ansHeading" />
</div>
How it will render by prettify?
I am using Prettify.js and css for my web site but it is not working for HTML
Let's say I have HTML like this:
<div style="padding:3px 0px">
<asp:Label ID="lblTotalAns" runat="server" Text="0 Answers" CssClass="ansHeading" />
</div>
How it will render by prettify?
Share Improve this question edited Mar 8, 2012 at 14:51 tonymarschall 3,8823 gold badges33 silver badges52 bronze badges asked Feb 8, 2012 at 17:13 Ali AdraviAli Adravi 22.8k9 gold badges91 silver badges94 bronze badges4 Answers
Reset to default 15 +25You have to change < to < and > to > otherwise your code gets rendered by the browser. So your code has to look like this:
<pre class="prettyprint">
<div style="padding:3px 0px">
<asp:Label ID="lblTotalAns" runat="server" Text="0 Answers" CssClass="ansHeading" />
</div>
</pre>
I have created a simple example with your html source: http://jsfiddle/aSb76/
This can also be seen in prettify tests source and the result page.
The basic setup on howto include prettify.js is described in the README.
I have no clue about escaping in ASP, but the first search result in Google for something
like 'asp encode html entities' brought up <%= Server.HTMLEncode(sValue) %>. Maybe you can use this.
I would like to propose an alternative solution through which you could achieve the same result (that I assume) you would like to get (= syntax highlighted HTML code shown embedded in a webpage).
Github has a neat service (called Gist) that is used for saving little code snippets online and it allows:
- syntax highlighting
- embedding of code snippet in your HTML (with 1.)
Here you can see your example markup on Github Gist: https://gist.github./2012701
Here you can see it embedded in HTML: http://jsfiddle/6YHDu/
If the code you want to show syntax highlighted is generated dynamically (not entered manually), then forget my proposal and go with Prettify.js, otherwise Gist is a very user friendly alternative.
You would use it like this:
In your <head> element:
<link href="prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="prettify.js"></script>
In your <body> element:
<body onload="prettyPrint()">
<div style="padding:3px 0px">
<asp:Label ID="lblTotalAns" runat="server" Text="0 Answers" CssClass="ansHeading" />
</div>
</body>
I agree with @tonymarschall I found this alternative if you are looking for one. They say you can use instead of and you wouldn't have to decorate your code with ugly <s Maybe there's some escape involved with Prettify.js as well? After all it is made by Google!