Document

HTML Comment – How to Comment Out a Line or Tag in HTML

Dionysia Lemonaki

In this article, you’ll learn how to add single and multi-line comments to your HTML documents.

You’ll also see why comments are considered a good practice when writing HTML code.

The HTML Comment Tag

The general syntax for an HTML comment looks like this:

Comments in HTML start with .

Don’t forget the exclamation mark at the start of the tag! But you don’t need to add it at the end.

The tag surrounds any text or other HTML tag you want to comment out.

When to Use HTML Comments

HTML comments don’t get displayed in the browser. This means that any comments you add to your HTML source code will not be shown when the document gets rendered in a web browser.

That being said, keep in mind that anyone can view the source code of practically every website published on the Internet by going to View -> Developer -> View Source – and this also includes all comments!

So your comments will be visible for others to see if you make the HTML document public and they choose to look at the source code.

Writing comments is helpful and it’s a good practice to follow when writing source code. Comments help you document and communicate about your code and thought process to yourself (and others). It also reminds you what you were thinking/doing when you come back to a project after months of not working on it.

Comments also help you communicate with other developers who are working on the project with you. Your comments can clearly explain to them why you added certain lines of code.

How to Write Single-Line Comments in HTML

A single-line comment only spans one line. As mentioned earlier, that line will not get displayed in the browser.

Use a single-line comment when you want to explain and clarify the purpose behind the code that follows it or when you want to add reminders to yourself like so:

         
About me
 
I am learning to code with freeCodeCamp.
 
I am going through each and every one of their awesome and super helpful certifications.
 
I am on my way to becoming a fullstack web developer!
 
Work Experience
   

Single-line comments are also helpful when you want to make clear where a tag ends. This comes in handy in a long and complex HTML document where a lot is going on and you may get confused as to where a closing tag is situated.

How to Write Inline Comments in HTML

You can also add comments in the middle of a sentence or line of code.

Only the text inside the will be commented out, and the rest of the text inside the tag won’t be affected.

        
I am a web developer
   

How to Write Multi-Line Comments in HTML

Comments can also span multiple lines, using the exact same syntax you’ve seen so far.

        
I am a web developer
  

How to Comment Out a Tag in HTML

So what if you want to comment out a tag in HTML?

You wrap the tag you’ve selected in , like so:

 !DOCTYPE html>       
My portfolio page
 
freeCodeCamp certification projects
 --> 
About Me
   

Commenting out tags helps with debugging.

When something isn’t working the way it’s supposed to or they way you intended it to, start commenting out individual tags one by one. This lets you test them and see which one is causing the issue.

Keyboard Shortcut for Adding HTML Comments

There are shortcuts you can use for adding comments – and you’ll probably end up using them a lot. The shortcut is Command / for Mac users or Control / for Windows and Linux users.

To add a single-line comment, just hold down the combo of keys shown above inside the code editor. Then the whole line you’re on will be commented out. Just keep in mind that since everything will be commented out on that line, this only works for single-line comments. You’ll need to add inline comments manually.

For adding multi-line comments, select and highlight all the text or tags you want to comment out and hold down the two keys shown previously. Each line you selected will now have a comment.

Conclusion

And there you have it – now you know how and why to use comments in HTML!

Learn more about HTML by watching the following videos on freeCodeCamp’s YouTube channel:

freeCodeCamp also offers a free, project-based certification on Responsive Web Design.

It is ideal for complete beginners and assumes no previous knowledge. You’ll start from the absolute necessary basics and build your skills as you progress. In the end, you’ll complete five projects.

Thanks for reading and happy learning 🙂

Источник

HTML Comments

HTML comments are not displayed in the browser, but they can help document your HTML source code.

HTML Comment Tag

You can add comments to your HTML source by using the following syntax:

Notice that there is an exclamation point (!) in the start tag, but not in the end tag.

Note: Comments are not displayed by the browser, but they can help document your HTML source code.

Add Comments

With comments you can place notifications and reminders in your HTML code:

Example

Hide Content

Comments can be used to hide content.

This can be helpful if you hide content temporarily:

Example

This is another paragraph

—>

You can also hide more than one line. Everything between the will be hidden from the display.

Example

Hide a section of HTML code:

This is a paragraph.

Look at this cool image:

—>

This is a paragraph too.

Comments are also great for debugging HTML, because you can comment out HTML lines of code, one at a time, to search for errors.

Hide Inline Content

Comments can be used to hide parts in the middle of the HTML code.

Example

Hide a part of a paragraph:

HTML Exercises

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

Overview

The HTML comments tag is used to add a comment to the HTML code. The web browser ignores the comment. We can use the comment tags to explain the HTML code, program documentation, author information, license header, etc.

The text in the HTML comment tag will not be displayed on the web page. Comments are meant for others to understand the code better. Comments increase code readability.

HTML Comments Syntax

Example

Hi, How are you?

Welcome to www.TestingDocs.com

HTML Editor generally highlights the comments in different color text.

Lines 7, 8 are comments in the code. The comments are single-line comments. They start with tag.

Sample Output

Multiline Comments

Comments can span across multiple lines. Example of multi-line comment shown below:

We can even decorate the comment tag with extra characters. For example, to display a box-like comment box.

Common Error

The most common error is using spaces in the comment tags. For example,

This is an invalid HTML comment. There is a space in the comment start tag between angle bracket and exclamation mark.

Invalid comments will be displayed in the browser.

HTML Tutorials

HTML Tutorials on this website:

Источник

HTML comments

1. HTML comments stop the HTML code written within it, form being processed while displaying an HTML document in the browser.

2. HTML comments start with «».

3. HTML comments can be placed anywhere in an HTML document. But our suggestions is , do not place it before DOCTYPE.

4. HTML comment can not be nested, i.e. a comment can not hold another comment within it.

Pictorial presentation of HTML comment

HTML page with some HTML comment

      
HTML tutorials - w3resource.com
 
HTML Elements are key components of an HTML document
 
Start learning HTML
  
Write to us
 Name: 
 
email: 
 
Remarks: 

HTML tutorials — w3resource.com

HTML Elements are key components of an HTML document

Write to us

If you view this HTML comment example in a separate browser window, you will find that the commented code is not being displayed.

Conditional comments

Description of Conditional comments

1. Conditional comments are conditional statements to hide or provide HTML source code from Internet Explorer.

2. There are two types of conditional comments — downlevel-hidden — which is used to hide HTML source and downlevel-revealed which is used to reveal HTML source code in Internet Explorer.

Syntax of Conditional comments

Operators used in conditional comments

Operators	Description
!	NOT operator
lt	Less than
lte	Less than equal to
gt	Greater than
gte	Greater than equal to
( )	Subexpression, i.e to construct a condition within a condition
&	AND operator
|	OR operator

Example of conditional comment (downlevel hidden)

      
We are learning conditional comment
 

Example of conditional comment (downlevel revealed)

      
We are learning conditional comment
 
You can see this if your borwser is not IE
   

Test your Programming skills with w3resource’s quiz.

Follow us on Facebook and Twitter for latest update.

• Weekly Trends
• Java Basic Programming Exercises
• SQL Subqueries
• Adventureworks Database Exercises
• C# Sharp Basic Exercises
• SQL COUNT() with distinct
• JavaScript String Exercises
• JavaScript HTML Form Validation
• Java Collection Exercises
• SQL COUNT() function
• SQL Inner Join
• JavaScript functions Exercises
• Python Tutorial
• Python Array Exercises
• SQL Cross Join
• C# Sharp Array Exercises

We are closing our Disqus commenting system for some maintenanace issues. You may write to us at reach[at]yahoo[dot]com or visit us at Facebook

Источник