HTML Tutorial


Chapter 6 – HTML Comments

Welcome to the chapter 6 of our HTML Tutorial series.

In the last chapter we learnt about HTML Text Styles and Formatting. In this chapter we will learn about Comments in HTML.

HTML Comments are used in HTML documents in case you want to add an HTML code but do not want the browser to render it. It basically means when the HTML file is viewed over the browser, the content within the comment will be hidden from the user. The comment will be visible only in the source code of the HTML file.

HTML Image

Why do we need Comments in HTML?

As a Web Developer, you may want to use comments in HTML for multiple reasons:

  1. If you want to add documentation to certain code snippets for future reference.
  2. If you want to comment out certain piece of code which is obsolete but you want to keep it in the archives in case you want to refer it in future.
  3. If you want to add some comment as TODO tasks within your code where you want to mention some tasks regarding the enhancement of code or functionality.
  4. If you are debugging your code for some error and want to skip execution of certain line of HTML snippets.


Syntax:

The general syntax for adding an HTML comment is given below for reference:

<!-- This is an HTML comment -->
                        

The comment starts with “<!--" and ends with “-->”.


Things to remember:

Here are some points to note regarding HTML comments:

  1. You can add as many comments in your HTML file.

  2. Comment block can be used to hide multiple lines of HTML code in the following way:

    <!--
    
    <p> This is line 1 which is commented</p>
    <p> This is line 2 which is commented</p>
    -->
    <p> This is line 3 which is not commented</p>

  3. Similarly you can also use HTML comments within a subset of a single line in case you want to hide only a portion of a line. This can be achieved in the following way:

    <p>This is a paragraph containing <!-- a hidden text --> inside it</p>
                                

You can try running these code snippets on our Online HTML Editor to view the output.

I hope this tutorial was helpful. See you soon in our next tutorial.

Next Chapter Chapter 7 - HTML Hyperlinks

Follow Me on Social Media

Advertisement
FREE Sales CRM Software

Fully customizable CRM Software for Freelancers and Small Businesses

Signup for Free

Sign up for DigitalOcean Cloud

Get FREE $200 credits, deploy your hobby projects for Free

DigitalOcean Referral Badge
Sign up for Hostinger Cloud or VPS plans and get upto 20% Discount