Go to
Baking Ways / Productive Bytes

## Tuesday, April 13, 2010

### HTML, CSS, Java script comments

While working on this blog, I have realized that there are at lest three different ways to insert a comment on a HTML web page.

<!--This is a comment. Comments are not displayed in the browser-->

The tricky part was to find out how to visualize this comment on the webpage, something that is not supposed to show-up! . The solutions comes down to this table

ResultDescriptionEntity NameEntity Number
non-breaking space&nbsp;&#160;
<less than&lt;&#60;
>greater than&gt;&#62;
&ampersand&amp;&#38;
¢cent&cent;&#162;
£pound&pound;&#163;
¥yen&yen;&#165;
euro&euro;&#8364;
§section&sect;&#167;

As per above table, the HTML code necessary to show up HTML comments is

&lt;!-- This is a comment. Comments are not displayed in the browser --&gt;

Now the problem is- How do we visualize &lt; ?
In this case we just need to write in the HTML source page:
&amp;lt;

2) CSS comment
/*  comment here */
3) Java script comment
// Comment here

Here you can find few examples from my HTML template page

The Jave script is commented becasue is delimited by <!--    -->
In the CSS body element, you can find CSS comments /*   */

<--

<script src='http://www.mathjax.org/MathJax/MathJax.js' type='text/javascript'>  //
//  This script call is what gets MathJax loaded and running
//
MathJax.Hub.Config({
jax: ["input/TeX","output/HTML-CSS"],    // input is TeX and output is HTML-CSS format
extensions: ["tex2jax.js"],              // use the tex2jax preprocessor
tex2jax: {
//    inlineMath: [['$','$'],['\$$','\$$']], // uncomment to use $...$ for inline math
processEscapes: 1                      // set to 1 to allow \$to produce a dollar sign } }); --> body { /* background:$bgcolor; */ /* old code */
background:#d0e4fe; /* new code */
margin:0;
color:\$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}