Topic: HTML Basics

Comments – HTML

Summary

Syntax:

<!--  -->

Single line comment:

<!-- This is a comment in HTML -->

Multi-line comment:

<!--
  This is also
  a comment in HTML
-->

Details

Comments in HTML allow you to write notes to yourself about the code you’ve written. You can use them to quickly explain what parts of your code do. They can also serve as helpful reminders for what your code does when you revisit the project in the future. The text inside a comment will not show up on the actual web page.

As you can see from the examples above, comments can span a single line or multiple lines.

Comments can also be used to temporarily disable sections of code, so you can see what your web page looks like without a particular element or group of elements. Here’s an example:

<!-- <p>This paragraph text won't show when it's in a comment.</p> -->

If you decide that you don’t need the code that you’ve commented out, it’s best to delete the code rather than leave it in so you don’t end up with a bunch of commented out code in your HTML file.

Common problems

Generally speaking, you can’t have a comment inside another comment in HTML. Here’s an example:

<!-- Here's the start of the first comment
  <!-- This comment is nested inside the other comment -->
Here's the end of the first comment (careful: this line will appear on the web page!) -->

The last line of the comment will appear on the web page. The reason why is that the closing part of the inner comment acts as the closing part of the outer comment as well.

Demo

References

Getting Started with HTML on MDN