Skip to content
Related Articles

Related Articles

Most commonly used tags in HTML
  • Difficulty Level : Medium
  • Last Updated : 22 Mar, 2021

HTML contains lots of predefined tag. Some of them are described below:
 

Document structure tag: 

  • HTML tag: It is the root of the html document which is used to specify that the document is html.
    Syntax: 
     
<html> Statements... </html>
  • Code: 
     

html




<html>
    <head>
        <title>Title of your web page</title>
    </head>
    <body>HTML web page contents </body>
</html>
  • Head tag: Head tag is used to contain all the head element in the html file. It contains the title, style, meta, … etc tag.
    Syntax: 
     
<head> Statements... </head>
  • Code: 
     

html




<head>Contains elements describing the document</head>
  • Body tag: It is used to define the body of html document. It contains image, tables, lists, … etc.
    Syntax: 
     
<body> Statements... </body>
  • Code: 
     

html




<body>The content of your HTML page</body>
  • Title tag: It is used to define the title of html document.

Syntax: 

<title> Statements... </title>

Code: 

html




<title>tab name</title>

Content container tag: 



Heading tag: It is used to define the heading of html document.
 

Syntax: 

<h1> Statements... </h>
<h2> Statements... </h2>
<h3> Statements... </h3>
<h4> Statements... </h4>
<h5> Statements... </h5>
<h6> Statements... </h6>

Code: 

html




<h1>Heading 1 </h1
<h2>Heading 2 </h2>
<h3>Heading 3 </h3>
<h4>Heading 4 </h4>
<h5>Heading 5 </h5>
<h6>Heading 6 </h6>
  • Paragraph tag: It is used to define paragraph content in html document.
    Syntax: 
     
<p> Statements... </p>
  • Code: 
     

html




<p>GeeksforGeeks: Computer science portal</p>
  • Emphasis tag: It is used to renders as emphasized text.
    Syntax: 
     
<em> Statements... </em>
  • Code: 
     

html




<em>GeeksforGeeks</em>
  • Bold tag: It is used to specify bold content in html document.
    Syntax: 
     
<b> Statements... </b>
  • Code: 
     

html




<b>Bold word</b>
  • Italic tag: It is used to write the content in italic format.
    Syntax: 
     
<i> Statements... </i>
  • Code: 
     

html




<i>GeeksforGeeks</i>
  • Small (text) tag: It is used to set the small font size of the content.
    Syntax: 
     
<small> Statements... </small>
  • Code: 
     

html




<small>Example</small>
  • Underline tag: It is used to set the content underline.
    Syntax: 
     
<u> Statements... </u>
  • Code: 
     

html




<u>GeeksforGeeks</u>
  • Deleted text tag: It is used to represent as deleted text. It cross the text content.
    Syntax: 
     
<strike> Statements... </strike>
  • Code: 
     

html




<strike>GeeksforGeeks</strike>
  • Anchor tag: It is used to link one page to another page.
    Syntax: 
     
<a href="..."> Statements... </a>
  • Code: 
     

html




GeeksforGeeks</a>
  • List tag: It is used to list the content.
    Syntax: 
     
<li> Statements... </li>
  • Code: 
     

html




<li>List item 1</li>
<li>List item 2</li>
  • Ordered List tag: It is used to list the content in a particular order.
    Syntax: 
     
<ol> Statements... </ol>
  • Code: 
     

html




<ol>
     <li>List item 1</li>
     <li>List item 2</li>
     <li>List item 3</li>
     <li>List item 4</li>
</ol>
  • Unordered List tag: It is used to list the content without order.
    Syntax: 
     
<ul> Statements... </ul>
  • Code: 
     

html




<ul>
     <li>List item 1</li>
     <li>List item 2</li>
     <li>List item 3</li>
     <li>List item 4</li>
</ul>
  • Comment tag: It is used to set the comment in html document. It is not visible on the browser.
    Syntax: 
     
<!-- Statements... -->
  • Code: 
     

html




<!--Comment section-->
  • Scrolling Text tag: It is used to scroll the text or image content.

Syntax: 

<marquee> Statements... </marquee>
  • Code: 
     

html




<marquee bgcolor="#cccccc" loop="-1"
scrollamount="2" width="100%">
Example Marquee</marquee>
  • Center tag: It is used to set the content into the center.
    Syntax: 
     
<center> Statements... </center>
  • Code: 
     

html




<center>GeeksforGeeks</center>
  • Font tag: It is used to specify the font size, font color and font-family in html document.
    Syntax: 
     
<font> Statements ... </font>
  • Code: 
     

html




<font face="Times New Roman">Example</font>

Empty (Non-Container) Tags: 
 

  • Line break tag: It is used to break the line.

Syntax: 

<br>
  • Code: 
     

html




GeeksforGeeks<br>A computer science portal
  • Image tag: It is used to add image element in html document.
     

Syntax: 

<img>
  • Code: 
     

html




<img src="gfg.jpg" width="40"
height="40" border="0">
  • Link tag: It is used to link the content from external source.
    Syntax: 
     
<link>
  • Code: 
     

html




<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
  • Horizontal rule tag: It is used to display the horizontal line in html document.
    Syntax: 
     
<hr/>
  • Code: 
     

html




<hr width="50%" size="3" />
  • Meta tag: It is used to specify the page description. For example: last modifier, authors, … etc.
    Syntax: 
     
<meta> Statements ... <meta>
  • Code: 
     

html




<meta name="Description"
    content="Description of your site">
<meta name="keywords"
    content="keywords describing your site">

Tables Tags: Table tag is used to create a table in html document. 
 

  • Table tag: 
    Syntax: 
     
<table> Statements... </table>
  • Code: 
     

html




<table border="4" cellpadding="2" cellspacing="2" width="100%">
<tr> <td>Column 1</td>
<td>Column 2</td> </tr> </table>
  • Tr tag: It is used to define row of html table.
    Syntax: 
     
<tr> Statements... </tr>
  • Code: 
     

html




<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
  • Th tag: It defines the header cell in a table. By default it set the content with bold and center property.
    Syntax: 
     
<th> Statements ... </th>
  • Code: 
     

html




<table>
 <tr>
   <th>Month</th>
   <th>Savings</th>
 </tr>
 <tr>
   <td>January</td>
   <td>$100</td>
 </tr>
</table>
  • Td tag: It defines the standard cell in html document.
    Syntax: 
     
<td> Statements ... </td>
  • Code: 
     

html




<table>
  <tr>
    <td>Cell A</td>
    <td>Cell B</td>
  </tr>
</table>

Input Tags: 
 

  • Form tag: It is used to create html form for user.
    Syntax: 
     
<form> Statements ... </form>
  • Code: 
     

html




<form action="mailto:you@yourdomain.com ">
  Name: <input name="Name" value="" size="80"><br>
  Email: <input name="Email" value="" size="80"><br>
  <br><center><input type="submit"></center>
</form>
  • Submit input tag: It is used to take the input from the user.
    Syntax: 
     
<input>
  • Code: 
     

html




<form method=post action="/cgibin/example.cgi">
<input type="text" style="color: #ffffff;
 font-family: Verdana; font-weight: bold;
 fontsize: 12px; background-color: #72a4d2;"
 size="10" maxlength="30">
<input type="Submit" value="Submit">
</form>
  • Dropdown option tag: It is used to select an option from a drop-down list.
    Syntax: 
     
<option> Statements ... </option>
  • Code: 
     

html




<form method=post action="/cgibin/example.cgi">
<center> Select an option:<select>
<option>option 1</option>
<option selected>option 2</option>
<option>option 3</option>
</form>
  • Radio button tag: It is used to select only one option from the given options.
    Syntax: 
     
<input>
  • Code: 
     

html




<form method=post action="/cgibin/example.cgi">
Select an option:<br>
<input type="radio" name="option"> Option 1
<input type="radio" name="option" checked> Option 2
<input type="radio" name="option"> Option 3

 

My Personal Notes arrow_drop_up
Recommended Articles
Page :