HTML Comments

Here, we have discussed about HTML comments and also learn different types of HTML comments (i.e., html singleline comment, html multiline comment...

In this article, you will learn about HTML comment and also learn different types of HTML comments (i.e., html singleline comment, html multiline comment, html inline comment etc.) with the help of examples.

HTML Comment

HTML Comment

HTML comments are those parts of code that are completely ignored by any web browser. It is considered a good coding practice which greatly helps the coders and readers to understand that piece of code particularly complex source code. Most of coder use html comments as a note or reminder for oneself. 

Syntax:

<!-- Write your comment here -->

One thing to note that the syntax of the above HTML comment has only one exclamation (!) point which is in the first tag not in the end tag.

Type of Comments in HTML

There are six ways to comment in html which are explained as follows;

Html Singleline Comment

Singleline comments in HTML are those comments that end in a single line. The span of these comments are of only one line.

Now let's illustrate html Singleline comment with the help of following example;

<!DOCTYPE html>

<html>

<head>

    <title>Html Singleline Comment Example</title>

</head>

<body> 

     <!-- This is Singleline Comment example and this comment statement won't show in browser -->

     <p>This is a paragraph</p>

</body>

</html>

Output

html Singleline comment example

Html Multiline Comment

Multiline comment in html are those comments that end in multi lines. The span of these comments are of Multi lines and with the help of the exact same syntax you can even comment in Multiline.

Now let's understand html multiline comment with the help of following example;

<!DOCTYPE html>

<html>

<head>

    <title>Html Multiline Comment Example</title>

</head>

<body> 

     <!--

This is Multiline Comment example

and this comment statement won't

show in browser

-->

     <p>This is a paragraph</p>

</body>

</html>

Output

Html Multiline Comment Example

Html Inline Comment

In html, You can also wrap comments in the middle of sentence or in line of code. 

Now let's illustrate html inline comment with the help of following example;

<!DOCTYPE html>

<html>

<head>

    <title>Html inline Comment Example</title>

</head>

<body> 

     <p>This is a <!-- This is html inline Comment Example--> paragraph</p>

</body>

</html>

Output

Html inline Comment Example

Html Comment out a Tag

You can also use html comments to comment a tag. Now you must be thinking what is the meaning of comment out a tag? let's suppose, you created an HTML document and something isn't working the way it's supposed to. At that time you can comment out individual tags one by one using HTML comment out a tag and can perform the process of debugging. 

In the following illustration we have discussed how to comment out a tag in html ;

<!DOCTYPE html>

<html>

<head>

    <title>Html Comment out a tag Example</title>

</head>

<body> 

<p>This is a first paragraph</p>

     <!-- <p>This is a second paragraph</p> -->

     <p>This is a third paragraph</p>

</body>

</html>

Output

Html Comment out a tag Example

HTML Comment Tag

By using html <comment> tag you can also comment in html but there are only a few browsers that support the <comment> tag.

Let's see with the help of example whether the html <comment> tag actually works or not;

<!DOCTYPE html>

<html>

<head>

    <title>Html Comment tag Example</title>

</head>

<body> 

<p>This is a <comment>first</comment> paragraph</p>

</body>

</html>

Output

Html Comment tag Example

In the above illustration, we used Google Chrome browser so maybe the HTML <comment> tag didn't work properly. But if we ran this HTML document on the old version of Internet Explorer, the <comment> tag would work.

HTML Conditional Comment

Html conditional comments are those comments which are ignored by other browsers and work in internet explorer only. Conditional comments are generally used to give conditional comments to the different versions of internet explorer (Explorer 5 onwards).

Now let's illustrate html conditional comment with the help of following example;

<!DOCTYPE html>

<html>

<head>

    <title>Html Conditional Comment Example</title>

<!--[if IE 9]>

Special instructions for IE 9 here

<![endif]-->

</head>

<body> 

<p>This is a paragraph</p>

</body>

</html>

Output

Html Conditional Comment Example

Conclusion

Above we have discussed about HTML comments and also learn different types of HTML comments (i.e., html singleline comment, html multiline comment, html inline comment etc.) with the help of examples. HTML comments are those parts of code that are completely ignored by any web browser.