Document

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

Dionysia Lemonaki

Dionysia Lemonaki

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

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: How to Comment Out your HTML Code

HTML Comments: How to Comment Out your HTML Code

The comment tag is an element used to leave notes, mostly related to the project or the website. This tag is frequently used to explain something in the code or leave some recommendations about the project. The comment tag also makes it easier for the developer to come back and understand the code he’s written at a later stage. Comments can also used for commenting out lines of code for debugging purposes.

It is good practice to add comments to your code, especially when working with a team or at a company.

Comments are started with , and can span multiple lines. They can contain code or text, and won’t appear on the front-end of the website when a user visits a page. You can view comments through the Inspector Console, or by viewing Page Source.

Example

 Read more: https://html.com/tags/comment-tag/#ixzz4vtZHu5uR   

FreeCodeCamp web

FreeCodeCamp is an open-source project that needs your help

Conditional Comments

Conditional Comments defines some HTML tags to be excuted when a certain codition is fullfilled.

Conditional Comments are only recognised by Internet Explorer Version 5 through to Version 9 — IE5 — IE9.

Example

     

Keep in mind that if you use multi-line comments, you will have to make sure you use the —> tag to close the comment. If you don’t, the rest of the markup will be ignored and potentially break your page.

Conclusion

You can use comments to explain the HTML markup you’ve written to yourself. You can also use comments to make your markup easier to read and understand by labeling different sections.

Another use for comments is to hide parts of a website from rendering, like things that are still in development or to quickly disable certain functionality.

Either way, hopefully this post has helped you learn how to make single line and multi-line comments in HTML.

If you want to learn about web development, founding a start-up, bootstrapping a SaaS, and more, follow me on Twitter! You can also join the conversation over at our official Discord!

Give feedback on this page , tweet at us, or join our Discord !

Источник

How to Comment in HTML

wikiHow is a “wiki,” similar to Wikipedia, which means that many of our articles are co-written by multiple authors. To create this article, 27 people, some anonymous, worked to edit and improve it over time.

The wikiHow Tech Team also followed the article’s instructions and verified that they work.

This article has been viewed 290,759 times.

A comment is a line of code that is not read by web browsers. Commenting your code allows you to leave reminders and explanations for yourself and any other coder that will be working on the page. Commenting can also be used to quickly disable parts of your code when you’re testing or working on a new feature that isn’t ready yet. Learning how to properly use comments will lead to more efficient coding, for you and your coworkers.

Image titled 795094 1

Insert a single-line comment. Comments are designated by the tags . You can insert quick comments to remind you what is happening with the code.

html> head> title>Comment testtitle> head> body> p>This is the websitep> body> html> 

Image titled 795094 2

Create a multiline comment. Your comments can span multiple lines, which is useful for explaining complex code, or for blocking off large pieces of code.

html> head> title>Comment testtitle> head> body>   Your comment can be as long as you need it to be. Everything within the comment tags is kept from affecting the code on the page. --> p>This is the websitep> body> html> 

Image titled 795094 3

Use the comment function to quickly disable code. If you’re trying to track down a bug or want to keep code from running on the page, you can use the comment function to quickly block it off. That way, you can easily restore the code by deleting the comment tag.

html> head> title>Comment testtitle> head> body> p>Check out these imagesp> img src="/images/image1.jpg">   --> body> html> 

Image titled 795094 4

Use the comment function to hide scripts on unsupported browsers. If you are programming in JavaScript or VBScript, you can use the comment function to hide the script on browsers that don’t support it. Insert the comment at the start of the script, and end it with //—> to ensure that the script works on browsers that do support it.

html> head> title>VBScripttitle> head> body> script language="vbscript" type="text/vbscript">  document.write("Hello World!") //--> script> body> html> 
  • The // in the end tag will prevent the script from executing the comment function if scripts are supported by the browser. [1] X Research source

Community Q&A

In the code. As the article said, it wont really show on the website, however it will be saved in the code.

Thanks! We’re glad this was helpful.
Thank you for your feedback.
As a small thank you, we’d like to offer you a $30 gift card (valid at GoNift.com). Use it to try out great new products and services nationwide without paying full price—wine, food delivery, clothing and more. Enjoy! Claim Your Gift If wikiHow has helped you, please consider a small contribution to support us in helping more readers like you. We’re committed to providing the world with free how-to resources, and even $1 helps us in our mission. Support wikiHow

Comments placed on your website are done in PHP & MySQL code, not HTML. If you have CPanel, you can go to your Softaculous Apps Installer and install an APP that will either create a bulletin board, guest book or even down load word press onto your site. These apps are already written PHP/MySql and you can turn off or on the comments.

Thanks! We’re glad this was helpful.
Thank you for your feedback.
As a small thank you, we’d like to offer you a $30 gift card (valid at GoNift.com). Use it to try out great new products and services nationwide without paying full price—wine, food delivery, clothing and more. Enjoy! Claim Your Gift If wikiHow has helped you, please consider a small contribution to support us in helping more readers like you. We’re committed to providing the world with free how-to resources, and even $1 helps us in our mission. Support wikiHow

You can include comments in your HTML code as follows: You will be able to see this when you’re reading the code, but your comment will not show up in your viewer’s browser.

Thanks! We’re glad this was helpful.
Thank you for your feedback.
As a small thank you, we’d like to offer you a $30 gift card (valid at GoNift.com). Use it to try out great new products and services nationwide without paying full price—wine, food delivery, clothing and more. Enjoy! Claim Your Gift If wikiHow has helped you, please consider a small contribution to support us in helping more readers like you. We’re committed to providing the world with free how-to resources, and even $1 helps us in our mission. Support wikiHow

Источник

Читайте также:  What is css display flex
Оцените статью