HTML Comments

Add notes to your code that the browser ignores.

Syntax<!-- This is a comment -->

Comments let you leave notes in your HTML. They are not shown on the page and are ignored by the browser.

Comments are useful for explaining your code or temporarily hiding parts of it.

How to write a comment

Start with <!-- and end with -->.

Example

Try it yourself
Loading editor…
Press Run to see the result.

When to use it

  • A developer leaves an HTML comment to explain why a workaround div is needed for a legacy browser bug.
  • A team uses comments to temporarily disable a section of HTML during debugging without deleting code.
  • A maintainer adds a comment above a complex table to document its intended data structure for future editors.

More examples

Single-line comment label

A single-line comment labels the nav block to help future developers scan the markup quickly.

Example · html
<!-- Navigation menu -->
<nav>
  <a href="/">Home</a>
  <a href="/about">About</a>
</nav>

Multi-line comment disabling a block

A multi-line comment wraps an entire block to disable it temporarily without losing the code.

Example · html
<section>
  <h2>Promotions</h2>
  <!--
  <div class="banner">
    <p>Summer sale 50% off!</p>
  </div>
  -->
  <p>No active promotions.</p>
</section>

Section divider comment block

A block comment acts as inline documentation describing the section's CSS and link dependencies.

Example · html
<!-- ======================
     HERO SECTION
     Background: hero.css .hero-bg
     CTA: links to /signup
     ====================== -->
<section class="hero">
  <h1>Build faster.</h1>
  <a href="/signup" class="btn">Get started</a>
</section>

Discussion

  • Be the first to comment on this lesson.
HTML Comments — HTML | SoundsCode