DEV Community

Max Lockwood
Max Lockwood

Posted on • Updated on • Originally published at maxlockwood.dev

How to Write HTML Comments

The HTML Comment Tag

A comment in HTML is text that is encased in the <!╌ and ╌> tags. By using this technique, you can inform a browser that some elements are comments and shouldn’t be displayed on the front end.

<!-- Write your comments here -->
Enter fullscreen mode Exit fullscreen mode

Comments in HTML start with <!╌ and end with ╌>. Notice that there is an exclamation point (!) in the start tag, but not in the end tag.

When to Use HTML Comments

When creating source code, leaving comments is an excellent habit to get into. Comments allow you to communicate with yourself about your code and thought process. When you return to a project after a period of time without working on it, it also reminds you of what you were thinking or doing.

You can communicate with other developers who are working on the same project as you by leaving comments. They can understand your intentions for adding specific lines of code from your comments.

How to Write Single-Line Comments in HTML

Only one line can contain a single-line comment. That line will not be displayed in the browser, as was already explained.

<!-- You will not be able to see this text. -->
<p>You will be able to see this text.</p>
Enter fullscreen mode Exit fullscreen mode

How to Write Inline Comments in HTML

A sentence or line of code can also have comments added in the middle of it.

The text outside of the <!-- --> will remain unaffected, just the text inside of it will be commented out.

<body>
    <p>I am <!-- going to be --> a frontend developer.</p>
</body>
Enter fullscreen mode Exit fullscreen mode

How to Write Multi-Line Comments in HTML

Although we have only seen single-line and inline comments up to this point, HTML also enables multi-line comments.

The comment beginning tag (<!--) and ending tag (-->) put before the first line and end of the last line, respectively, as demonstrated in the example given below, allow you to comment on several lines.

<body>
    <!--
        This is a multiline comment and it can
        span through as many as lines you like.
    -->
    <p>Document content goes here...</p>
</body>
Enter fullscreen mode Exit fullscreen mode

Keyboard Shortcut for Adding HTML Comments

You can use shortcuts to quickly add comments, and you’ll probably find yourself doing so frequently. For Mac users, the shortcut is Command /; for Windows and Linux users, it is Control /.

Learn more about HTML by reading the following articles on my website:

How to write “Hello World” in HTML
What is an HTML Document’s Basic Structure?
What is an HTML Element? How do you create one?

Want to learn more about the basics of HTML? then follow this link to MDN Web Docs – HTML basics

Top comments (0)