programminghead Logo

Commenting in HTML :

The process of Commenting in HTML allows users to add some text or Lines which can be seen inside HTML Code but Ignored by the Browsers at the time of Execution. So we can write some Important lines as an HTML Comment without Messing with Code Output (We can also Whole HTML Webpages Data executable just Commenting them out using HTML Comments).

Commenting in HTML: Example


    <!-- this is my HTML Comment -->

In more simple words, Commenting in HTML or HTML Comments let us to write some texts inside the HTML Web-page, so other Person can read and get the Rough idea about the Particular line or Element.
You can assume Commenting in html or HTML Comments like a Guide for your HTML Code. Who will help other or Yourself to Understands your Messy or Lengthy code Easily.
HTML Comments are Not always used as a Page guide for Our HTML Web-page. We also can use Comments in HTML to Hide some HTML Tags/Data from Browser from Execution.

Example : I Have created a HTML Document where i have a Div and inside that Div i have 20 Different Headlines. To insert those 20 Headlines inside my Div i Have to Declare those Headlines Inside my Div's Starting and Closing Tag. Due too many ( 20 ) HTML Headlines in My HTML Code, My Code have became lengthy, Massey and Hard to Understand/Identify Every Declared HTML Tags. Because of that i have to use Commenting Process to avoid Confusion with my html ELements Starting and Closing tags.
for that kind of Problem i can write a little Comment after the Closing tag of my Div's at the Beginning so i can identify those Different HTML tag in Future.

Commenting in HTML Image

Comment Tags in HTML:

The process of Commenting in HTML or Adding Comment tag in HTML is Quit different then Other HTML Tags/Elemets, Where in other HTML Tags we have to write our tag's name Inside these two Angle brackets < and > to create a tag, But in the case of Comments, We have to insert ! exclamation mark followed by two -- Hyphens at the beginning and two hyphens at the end without ! exclamation sign.

Syntax of HTML Comments:


    <!-- this is my Comment in HTML -->

HTML Multi-Line Comment :

Multi line Comment is just simple as Single line Comment, You just have to treat HTML Comment's <!-- starting and --> closing tag Right. Just insert one or more lines of Text inside those HTML Comment's Starting and Closing tags to make a Multi line Comment.

HTML Single and Multi line Comments Example :


  <!-- this is a Single line HTML Comment --> 

  <!-- 
  this is a Multi line HTML Comment line 1 
  this is a Multi line HTML Comment line 2
  this is a Multi line HTML Comment line 3
  --> 


Commenting HTML Elements :

Comments are not Always used as a Page Guide to write some text about any Tag or Code, Comments also used to Hide any HTML code/Tag/Element from Compiler/Browsers.So Except deleting any code you can Hide that Line/Lines and Prevent that code to Export on the Output Screen.
For that you just have to Declare that HTML Code/Element inside HTML Comment's <!-- starting and --> closing tags.

Commenting/Hiding HTML Element/Code:


<html>
 <head>
  <title>Commenting in HTML</title>
 </head>
 <body>

  <!-- 
   <h2> HTML Headline 1 <h2>
  -->
  
  <h2> HTML Headline 2 <h2>

 </body>
</html>

Results :

HTML Headline 2

HTML Comments Example :

Whole page's Conclusion.

Inserting Comments in HTML : HTML Comments Example


<html>
 <head>
  <title>Commenting in HTML</title>
 </head>
 <body>
  <div> <!-- starting Div Tag -->
    <p>para 1</p> <!-- for Name Introduction-->
    <p>para 2</p> <!-- for basic Details -->
    <p>para 3</p> <!-- for Conclusion -->

    <h2>Headline 1</h2>

    <!--
    <h2>Headline 2</h2>
    -->
  </div> <!-- closing Div Tag -->
 </body>
</html>

Results

para 1
para 2
para 3

Headline 1


Frequently asked Questions :

Question : comment box in html :

Answer : HTML Comments and Comment Box inside HTML is totally Different from Each other.
Where HTML Comments are used inside HTML as a Tag to Hide or Write Comments. And Comment Box in HTML used as Interactive ELements where user can Write Comments inside Input or TextAreas and After Submitting the Data/Comment another PHP page or JS page can store those Entered data inside SQL Database.
This Page is all About HTML Comments. But if we want to Get Comments from the Users we have to use:
<form> : where users will write there Comments and submit as a form to Assigned PHP/JS file.
<input> and <textarea> : A Place where use can write There Comments.
<button> :By clicking that Button users Can Submit there Comments. php or js file : To get the Data from Users and Store Them to a SQK Database. SQL Database : to store User Comments.

Creating a Comment Box in HTML (Only the Interface)


<html>
 <head>
  <title>HTML Comment BOX</title>

  <style>
   textarea{
   width:350px;
   height:60px;
   }
   button{
   width:350px;
   }
  </style>

 </head>
 <body>

  <textarea placeholder="Write your Comment"> </textarea>
  <button>Submit Comment</button>

 </body>
</html>

Results



Question : html single line comment

In other Languages like PHP, JavaScript or Sheets like CSS we have Single line (//) and Double line Comments (/**/), But in HTML we only have one Comment tag (<!-- -->) tag which we can treat as Both Single and Multi-Line Comment Tag.
So if we want to Add a Single line Comment in HTML we have write/include that line inside these (<!-- Single Line -->) comments tags, And if we want to add Multi-Line comments then we have to write those Multi-line inside there (<!-- Multi-Line -->) HTML Comment Tags.


Question : css comment tag

In CSS We have Both Single and Multi-Line Comments Tags.
Where (//) used for Single line Comment in CSS. For adding Single line Comments in CSS we just have to add these two slashes (//) before the line that we want to Comment.
And (/* */) used for Multi-line Comments. For adding Multi-Line comments in CSS we have to start comment using with (/*) and end CSS Comment with (*/).

CSS COmment (in External .css file)


 body{
  width:100%; 
  //body is 100% Single Line Comment
  height:100vh;
  margin:0px;
  /*
   body Height is 100 equal to total View Port Height
   and
   body margin is 0
  */
 }

Question: html comment shortcut

HTML Comment Shortcut are used in Popular and Profession Text Editors line Sublime Text Editor. Where some Keys Combinations allow users to add Comments to your HTML Page.
In subline Text Editor. You have to Pres Control/Command Key (ctrl) and slash (/) to add Comments.
ctrl+/ (windows)
command+/ (Mac)



Question: Comments in JavaScript

In JavaScript we have double slashes (//) for adding a Single line comment and slash and star/asterisk sign (/*) to start and start/asterisk slash (*/) to End Multi-line comments in JavaScript.

JavaScript Comments : JavaScript Single and Multi-Line Comments (External .js file)


var data=0; //variable called data's value is 0
data++;
/*
   here (++) will increment variable data's value by 1
   so now data is equal to 1
   data++ = data+1 = data=1
*/

Question: Comments in PHP

In PHP we have double slashes (//) for adding a Single line comment and slash and star/asterisk sign (/*) to start and start/asterisk slash (*/) to End Multi-line comments in PHP.

PHP Comments : PHP Single and Multi-Line Comments


 <?php
  $data=0; //variable called data's value is 0
  $data++;
  /*
   here (++) will increment variable data's value by 1
   so now data is equal to 1
   $data++ = $data+1 = $data=1
  */
 ?>

Question: how to create a comment box in html and javascript

Creating a comment box in HTML is easy.
Just create a form using HTML's form tag <form>....</form> and between the form tag's starting and closing tags create an input field for users to write some comments, using HTML's textarea tag <textarea> and use its placeholder attribute to display some text like "enter your comment" inside that input field. and after the textarea create a submit button to submit user comment to mysql Database using PHP file.

processing user's comment using JavaScript:
Using javaScript we can store user Comment to our Database without refreshing the current page. Use JavScript's POST/GET method to submit data to a PHP file. So that PHP file can submit Data to mysql Database.

in PHP file: first create a Database connection using Username, password and Database name. After that assign POST/GET values to PHP Variables. Then run MySql query to store data to the DataBase using Table name and Column.

comment box in HTML (Interface) and javascript (Programming)


<html>
<head>
	<title>Commenting in</title>
	<script type="text/javascript" src="jQueryfile.js"></script>
</head>
<body>
   <input type="text" placeholder="name" id="userName"><br/>
   <textarea placeholder="Write your Comment" id="userComment">
   </textarea ><br/>
   <input type="submit" id="btn">
   <p id="return"></p>
<script type="text/javascript" >
	$('#btn').click(function(){
	$.post("post.php", 
	{
        name:$('#userName').val(),
        comment:$('#userComment').val()
    },
    function(response){
    	$('#return').text(response);
        });
	});
</script>
</body>
</html>

post.php File : For Submitting Data to DataBase


<?php
$comment=$_POST['name'];
$name=$_POST['comment'];
$db = mysqli_connect("HostName", "UserName", "PassWord", "DatabaseName");
  $sql="INSERT INTO tablename(`column1`, `column1`) VALUES ('$name', '$comment')";
mysqli_query($db,$sql);
echo "Comment Submitted";
?>

Results



Question: comment out line

Ans :
I Believe that there isn't anything Like Comment outline in HTML. In HTML Comments is a piece of code which is ignored by any web browser. We can Write some Guidelines or Hide some HTML Elements from the Browser.
But if you want to Add out Line to Any HTML Element or to a Text inside HTML we can do that using CSS's outline Property. Outline or using CSS

comment box in HTML (Interface) and javascript (Programming)


<html>
<head>
  <style>
    h2
    {
      outline: 5px dotted green;
    }
  </style>
</head>
<body>
   <h2>
     Text's Out Line
   </h2>
</body>
</html>

Results

Text's Out Line

Comments

Jane

02:40 pm

Nice article

Admin

thanks for visiting our Website

Write to Us

Captcha