HTML Comments
Comments are notes in your code that the browser does not show on the page.
Comment Syntax
A comment starts with <!-- and ends with -->. Everything between them is ignored by the browser.
Example
<!-- This is a comment -->Adding Notes to Your Code
Use comments to explain your code, to yourself in six months or to a teammate.
Example
<!DOCTYPE html>
<html>
<body>
<!-- Main title of the page -->
<h1>Bilal's Tuition Centre</h1>
<!-- Timings: update every new term -->
<p>Classes from 4 pm to 7 pm.</p>
</body>
</html>Bilal's Tuition Centre Classes from 4 pm to 7 pm.
The comments are in the code, but only the heading and paragraph appear on the page.
Hiding Content While Testing
Comments are handy to switch off part of a page without deleting it.
Example
<!DOCTYPE html>
<html>
<body>
<p>Admission is open for the summer batch.</p>
<!--
<p>Special discount for early birds!</p>
<p>Offer ends on 30 June.</p>
-->
<p>Call us for details.</p>
</body>
</html>Everything between <!-- and --> is hidden, even several lines. Remove the comment markers and the paragraphs come back.
Comments Inside a Line
A comment can also sit in the middle of a line.
Example
<p>Fee is due on the <!-- check date with office --> 10th of every month.</p>Organising a Long Page
On big pages, comments act like signposts:
Example
<!-- ===== HEADER ===== -->
<h1>My Shop</h1>
<!-- ===== PRODUCTS ===== -->
<h2>New Arrivals</h2>
<!-- ===== FOOTER ===== -->
<p>Copyright 2026</p>In VS Code, select some lines and press Ctrl + / (Cmd + / on Mac) to comment or uncomment them in one step.
Important Warnings
| Rule | Why |
|---|---|
| Comments are not secret | Anyone can see them with View Source (Ctrl + U) |
| Do not nest comments | The first --> ends the comment, so the rest breaks |
| Keep them short and useful | Too many comments make code harder to read |
Never put passwords, private notes or rude remarks in comments. They are sent to every visitor's browser.
Exercise
Exercise
Which line is a correct HTML comment?