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.

Источник

How To Add Comments In HTML?

Imagine that you’re writing a lengthy paragraph in HTML. That can be up to hundreds of lines of code. How do you keep track of specific functions or lines of code? Here is where the comments come into play. A comment is a piece of text or a section of text that is not part of the document itself. It provides additional information.

Have you ever wondered how to comment in HTML, or have you been wondering if you should even do it at all? If you’re new to HTML, rest assured, it’s not that hard! Comments are one of the few ways you can communicate with other developers who may be working on the same code.

• Let you write short notes describing essential concepts, events, or additional information that can’t be put into words.
• Help improve the readability of your code. They explain and clarify the code’s purpose.
• Help other developers by communicating what they are doing while working on your project.

Learn How to Comment with Sololearn HTML Tutorial

Using comments is another way to “speak” to other programmers. You can leave notes encouraging you to revisit a part or give it a priority during your next redesign. You can provide explanatory notes for other contributors to a web project.

To better understand these features, let’s first talk about HTML comments. What even are HTML code comments? After that, we’ll talk about how to comment in HTML code.

What is a Comment in HTML Code?

A comment in HTML is a block of text that explains the code. The HTML processor ignores this block.

These comments are helpful for:

• Other HTML programmers.
• Yourself! You can set notes for yourself in the code for future use.

HTML allows comments without following any particular format

Comment Tag HTML

The source code can contain comments by using the comment tag in HTML. The browsers do not display comments. You can use comments to clarify your code, which will be useful when you change the source code. This is especially helpful if your code is complex.

Comments in HTML start with .

How Do You Insert a Comment in HTML?

To insert a comment in HTML, place the “” tags around the code you want to hide. Using these tags, browsers will not render this code on the front end.

How to Comment a Line in HTML?

A single-line comment is a comment that spans one line.

It’s a very common feature in HTML. It’s a helpful way to organize your thoughts about a particular section of code. Single-line comments are valuable for identifying where a tag stops. This is helpful if you’re trying to locate a closing tag in a critical, complicated HTML document with a lot going on.

You can add single line comment in your code as:

    
Hello World
 
Single line comment
  

How to Add Inline Comments?

Adding comments to a sentence or line of code is also possible.

The rest of the content inside the tag won’t be affected; only the text inside the!— –> will be commented out.

How to Add Multiple Line Comments in HTML

The syntax for adding multiple-line comments (!- ->)\ is essentially the same as what we use for single-line comments. As the second half of the comment (“->”) is appended where the intended comment lines in HTML end.

    
Hello World
 
This is multi-line comment
  

Adding HTML Content Out Block

Using the comment tags in HTML, you can also comment out a complex or a long piece of HTML code to disable it:

 
This text is visible. Check the source code for multi-line comments.
 

How to Comment in Style Tag?

A document can use the style tag to define style information. You specify how HTML elements are rendered in a browser with the element.

Comments in CSS can be added using the /* tag, which is then closed off using */.

Keyboard Shortcut for Adding HTML Comments

The shortcut is “Command /” for Mac users or “Control / “for Windows and Linux users.

Keep pressing the keys in the code editor to make a single-line comment. Afterward, you’ll see that your line is commented out. This will only work for single-line comments, as everything will be commented on that line. Commenting inline requires manual entry.

As you select and highlight all text or tags you want to remark, hold down the two keys to add multiple lines of comments. There will now be comments for each line you choose.

Tips for Writing HTML Comments

Although helpful, HTML comments should only be used when they would benefit the program. It’s not necessary to include comments to describe every function or to go into their detail. You should have the following tips in mind when composing HTML comments:

Newbies’ most common mistake is writing a comment that says, “This is what I did.” Instead, tell people exactly what you did and why you did it. If you have a lot of code, don’t just restate it in your comment. Explain how each line of code works together.

Don’t include any extraneous information in your HTML comments. The more information you put in the comment, the less likely people will read it and understand what you are trying to say.

HTML comments should be concise. They should not include any complex information. You should use easy and straightforward language that everyone can easily understand at a glance.

Now you should know how to comment in HTML!

Use HTML comments to make your scripts easier to read…whether it’s future you or any other potential code readers. It’ll be easier for people to grasp the purpose of your code if you include comments throughout it.

Check out the Sololearn HTML Tutorial to learn more about HTML and how to create web pages, including your blog page. It includes many engaging activities and opportunities to practice writing actual HTML code.

Источник