HTML Comments

HTML Comments: These are considered to be text (or) a piece of code written in the programming, for a better understanding of the program. And which are used in this language are known as ” HTML Comments“. Mainly in any program, anything written between them will be ignored. So, we cannot see them in our output which will be displayed in the browser.

HTML Comments

If you want we can add the comments on HTML by enclosing them in <!……….> Comments are also great for debugging, because you can comment out the lines of code, one at a time, to search errors.

Example:

<!DOCTYPE html>  
<html>  
<!-- This is Header section -->  
<head>  
    <!-- Internal CSS -->  
    <style>  
        body{  
            text-align: center;  
            background-color: #f0f8ff;  
            font-size: 30px;  
            color: red;  
        }  
    </style>  
</head>  
  
<!-- This is body section, write code here which you want to display on web-page -->  
<body>  
    <!-- heading tag -->  
 <h2>First WebPage</h2>  
  
 <!-- Paragraph tag -->  
 <p>Write your Content here!!!</p>  
</body>  
</html>

Multiline Comments in HTML

We can also comment on multiple lines at a time.

Example:

<h2>Cake Gallery</h2>  
<!-- This is image for HTMl tutorial 
you can see it on your web-page  
of your favorite browser -->  
<img src="html-mini-logo.jpg" alt="html-logo" height="300px"  
 width="300px">

Valid VS Invalid Comments in HTML

Comments should not be placed inside another comment.
There should not be any spaces between them.
And the double dash sequence “–” should not appear inside the comments.

Example:

<!DOCTYPE html>
<html>
   <head>
      <title>Valid Comment Example</title>
   </head>	
   <body>
      <!--   This is valid comment -->
      <p>Document content goes here.....</p>
   </body>	
</html>

Commenting in Style Sheets

In case if you are using CSS (Cascading style sheets) in your HTML code then it should be placed inside properly. so that the old browsers can work properly.

Example:

<!DOCTYPE html>
<html>
   <head>
      <title>Commenting Style Sheets</title>
      <style>
         <!--
            .example {
               border:1px solid #4a7d49;
            }
         //-->
      </style>
   </head>
  
   <body>
      <div class = "example">Hey, Freshersnow!</div>
   </body>	
</html>