Open In App

HTML Comments

Improve
Improve
Like Article
Like
Save
Share
Report

HTML comments are ignored by browsers if we comment in HTML code then codes are more readable to us. In lots of scenarios, we comment out a few elements for debugging purposes.

What are HTML Comments?

HTML comments are annotations or notes added in an HTML code that are not displayed by the browser. Just like comments in other languages HTML comments also serve the same purpose of providing code explanations, reminders, or instructions for developers who are collaborating on the same project.

HTML comments are not displayed on browsers while rendering the page making them useful to add additional information without affecting the appearance of the webpage. You can use the HTML comment tag to comment in the html code.

Ways to Comment in HTML

There are two ways to comment in HTML. Each type of comment can be used to add comments in HTML.

Comment

Descriptions

Syntax

Single-line

The single-line comment is given inside the ( <!–  comment –> ) tag. 

<!–  comment –>

Multi-line

It follows the syntax of a single-line comment by adding multiple lines in the comment.

<!– Multi
Line 
Comment –>

Note: The shortcut for adding the comment through the keyboard is by typing Ctrl + / in Windows, and Command + / for Mac users.

HTML Comments Example

  • Single Line Comment in HTML
  • Multiline Comment in HTML

Example 1: This HTML code shows how to write single-line comments and how to write an inline comment in HTML.

HTML




<!DOCTYPE html>
<html>
  
<body>
    <!--This is heading Tag-->
    <h1>GeeksforGeeks</h1>
  
    <!--This is single line comment-->
    <h2>This is <!--given for--> single line comment</h2>
  
</body>
  
</html>


Output: None of the comment will render on the browsers.

html single line comment example output

Example 2: The following HTML code shows how to write multi-line comments and how to write hidden HTML code sections.

HTML




<!DOCTYPE html>
<html>
  
<body>
  
    <!-- This is 
         heading tag -->
    <h1>GeeksforGeeks</h1>
  
    <!-- This is
         multi-line
         comment -->
    <h2>This is multi-line comment</h2>
    <!-- <button style="font-family: Sans-serif;">
           Click Me
         </button> -->
  
</body>
  
</html>


Output: None of the comment will render on the browsers.

html multi line comment example output

Conclusion

Comments in HTML provide a way to communicate with people in your code. HTML comments are the best way for developers to collaborate on a web development project. HTML comments can also be used as reminder notes for you to come back and make required changes.

Since comments do not appear on the front end of the page, and can only be viewed in source code, they are the best way to make well well-documented HTML project. Adding comments to your web project is a good practice and is followed by many developers.

We have explained single-line and multi-line comments with examples. We also covered the HTML comment tag and computer shortcuts for commenting on HTML code. Hope this article helps you understand HTML comments and how to use HTML comments.



Last Updated : 29 Feb, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads