Skip to content

HTML Comments Tag | Single ​Line | Multiline | How to

  • by

How to use an HTML Comments in HTML code?

You can do HTML comments like “<!- – comment – ->” in HTML document file. What does it mean? it begins with <!-- and the comment closes with -->.

Why HTML comments tag are used?

HTML code use comments tag for easy understands code functionalists. For example, you build a button for the open new site. But after some time you or your team comes into again same code but unable to find what is the use of that button. So commenting before tag elements will save time. Some advantages of use comment almost every programming languages are:-

  • Easily understand about component and function work later.
  • Maintain source code
  • Easy to find code pieces using find.

HTML single line comment Example

See below syntax for comment, it can use any place in HTML tag.

<!-- Write your comments here -->

Complete HTML comments code sample example.

<!DOCTYPE html>
<html>
    <!-- comment beofre body-->

    <body>
        
        <!-- Text size 24px-->
        <p style="font-size: 24px;">HTML single line comment Example</p>
        
        
    </body>
</html>

Output: Source code vs browser output. You can see in the output there only <p> tag content show.

Q: How to do Multiline comment in HTML?

Answer: A Multiple line comment in HTML use the same Single Line specific tag. See below code.

<!DOCTYPE html>
<html>
    <!-- comment body
     A funtion of add 2 number
     by Eh Team -->

    <body>
        
        <!-- Text size 24px-->
        <p style="font-size: 24px;">HTML Mulitline line comment Example</p>
        
        
    </body>
</html>

HTML Invalid Comments

There is many time programmer did wrong comment. Some of are:-

  • A nested comment is invalid
  • Space not allowed in open and tag close- You must also make sure that there are no spaces in the start-of comment string.

See the code if you do this mistake. Like the sample example of invalid comments.

<!DOCTYPE html>
<html>
    

    <body>
        
        <!-- <!-- Nested Invalid comment --> -->
        < !--   This is not a valid comment -->
        <p style="font-size: 24px;">HTML Invalid comment</p>
        
        
    </body>
</html>

Output: A output of this code.

HTML Invalid Comments

Note: The comment tag does not support any event attributes and standard attributes.

Do comment if you have any doubt and suggestion for this tutorial.

Note: The All How to HTML comment out examples are tested on Safari browser (Version 12.0.2).
OS: macOS 10.14 Mojave
Code: HTML 5 Version


Leave a Reply

Your email address will not be published. Required fields are marked *