How can I write comments in HTML?
The comment is the way to write some instructions, information, purpose etc. for the complete or a block or even a line of code in a program. For example, writing the name of the coder, the date when started coding, last updates, and purpose of using a particular block.
The text information written inside the comment does not execute. That may help the developer who is writing the program to understand the context or purpose of the code or a line of code in future.
Similarly, the comments are helpful for other developers as well that help them understand the code easily.
Different programming languages provide different ways, for example, in PHP you may write comment by using a double slash:
// Write comment here
The HTML comments can be written in single or multiple lines as shown below:
<!—Information / purpose of code here –>
For multi-line comments just enclose it after the comment as follows:
<!—Line number 1 for comment in HTML Second line of comment Third line of comment -->
A demo of single line HTML comment
In this example, the single line comments are written. A simple div element is created with a few CSS properties. You can see the comments enclosed in the demo page or code below:
See online demo and code
The code with comments:
<!DOCTYPE html>
<html>
<style>
.selcolor {
background: #D26900;
height: auto;
width:300px;
padding:20px;
font-size:15px;
color:#fff;
}
</style>
<body>
<!--The div displaying information about comments -->
<div class="selcolor">
A demo of using comments in HTML
<!-- HTML comments are written with these directives -->
</div>
</body>
</html>
You can see, the comments are not executed or displayed as you run the demo page.
A demo of using multi-line comments
In many situations, you may need writing the bigger descriptions in comments that require multiple lines. For that simply start the comments directive (<!–), write the comments in multiple lines and close just like in above demo:
See online demo and code
The code for writing multi-line comments:
<!DOCTYPE html>
<html>
<style>
.selcolor {
background: #34515F;
height: auto;
width:300px;
padding:20px;
font-size:15px;
color:#fff;
}
</style>
<body>
<!--The div displaying information about comments
You may write single line comments
OR just keep writing in new lines and close the comment by
using directive
-->
<div class="selcolor">
A demo of using multi-line comments in HTML
<!-- HTML comments are written with these directives -->
</div>
</body>
</html>
Also see: