Most commonly used tags in HTML

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:



    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

         
    <html>
        <head
            <title>Title of your web page</title
        </head
        <body>HTML web page contents </body
    </html>

    chevron_right

    
    

  • 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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <head>Contains elements describing the document</head>

    chevron_right

    
    

  • Body tag: It is used to define the body of html document. It contains image, tables, lists, … etc.

    Syntax:

    <body> Statements... </body>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <body>The content of your HTML page</body>

    chevron_right

    
    

  • Title tag: It is used to define the title of html document.

    Syntax:

    <title> Statements... </title>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <tittle>tab name</tittle>

    chevron_right

    
    

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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <h1>Heading 1 </h1>  
    <h2>Heading 2 </h2>
    <h3>Heading 3 </h3
    <h4>Heading 4 </h4
    <h5>Heading 5 </h5
    <h6>Heading 6 </h6>

    chevron_right

    
    

  • Paragraph tag: It is used to define paragraph content in html document.

    Syntax:

    <p> Statements... </p>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <p>GeeksforGeeks: Computer science portal</p>

    chevron_right

    
    

  • Emphasis tag: It is used to renders as emphasized text.

    Syntax:

    <em> Statements... </em>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <em>GeeksforGeeks</em>

    chevron_right

    
    

  • Bold tag: It is used to specify bold content in html document.



    Syntax:

    <b> Statements... </b>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <b>Bold word</b>

    chevron_right

    
    

  • Italic tag: It is used to write the content in italic format.

    Syntax:

    <i> Statements... </i>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <i>GeeksforGeeks</i>

    chevron_right

    
    

  • Small (text) tag: It is used to set the small font size of the content.

    Syntax:

    <small> Statements... </small>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <small>Example</small>

    chevron_right

    
    

  • Underline tag: It is used to set the content underline.

    Syntax:



    <u> Statements... </u>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <u>GeeksforGeeks</u>

    chevron_right

    
    

  • Deleted text tag: It is used to represent as deleted text. It cross the text content.

    Syntax:

    <strike> Statements... </strike>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <strike>GeeksforGeeks</strike>

    chevron_right

    
    

  • Anchor tag: It is used to link one page to another page.

    Syntax:

    <a href="..."> Statements... </a>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    GeeksforGeeks</a>

    chevron_right

    
    

  • List tag: It is used to list the content.

    Syntax:

    <li> Statements... </li>
    

    Code:



    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <li>List item 1</li
    <li>List item 2</li>

    chevron_right

    
    

  • Ordered List tag: It is used to list the content in a particular order.

    Syntax:

    <ol> Statements... </ol>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <ol
         <li>List item 1</li
         <li>List item 2</li>
         <li>List item 3</li
         <li>List item 4</li
    </ol

    chevron_right

    
    

  • Unordered List tag: It is used to list the content without order.

    Syntax:

    <ul> Statements... </ul>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <ul
         <li>List item 1</li
         <li>List item 2</li>
         <li>List item 3</li
         <li>List item 4</li
    </ul

    chevron_right

    
    

  • Comment tag: It is used to set the comment in html document. It is not visible on the browser.

    Syntax:

    <!-- Statements... -->
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!--Comment section-->

    chevron_right

    
    

  • Scrolling Text tag: It is used to scroll the text or image content.



    Syntax:

    <marquee> Statements... </marquee>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <marquee bgcolor="#cccccc" loop="-1"
    scrollamount="2" width="100%">
    Example Marquee</marquee>

    chevron_right

    
    

  • Center tag: It is used to set the content into the center.

    Syntax:

    <center> Statements... </center>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <center>GeeksforGeeks</center>

    chevron_right

    
    

  • Font tag: It is used to specify the font size, font color and font-family in html document.

    Syntax:

    <font> Statements ... <font>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

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

    chevron_right

    
    

Empty (Non-Container) Tags:

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



    Syntax:

    <br>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    GeeksforGeeks<br>A computer science portal

    chevron_right

    
    

  • Image tag: It is used to add image element in html document.

    Syntax:

    <img>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <img src="gfg.jpg" width="40"
    height="40" border="0">

    chevron_right

    
    

  • Link tag: It is used to link the content from external source.

    Syntax:

    <link>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <head>
    <link rel="stylesheet" type="text/css" href="style.css">
    </head>

    chevron_right

    
    

  • Horizontal rule tag: It is used to display the horizontal line in html document.

    Syntax:



    <hr/>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <hr width="50%" size="3" /> 

    chevron_right

    
    

  • Meta tag: It is used to specify the page description. For example: last modifier, authors, … etc.

    Syntax:

    <meta> Statements ... <meta>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

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

    chevron_right

    
    

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

  • Table tag:

    Syntax:

    <table> Statements... </table>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <table border="4" cellpadding="2" cellspacing="2" width="100%"
    <tr> <td>Column 1</td>
    <td>Column 2</td> </tr> </table>

    chevron_right

    
    

  • Tr tag: It is used to define row of html table.

    Syntax:



    <tr> Statements... </tr>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <table>
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
    </table>

    chevron_right

    
    

  • 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:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <table>
     <tr>
       <th>Month</th>
       <th>Savings</th>
     </tr>
     <tr>
       <td>January</td>
       <td>$100</td>
     </tr>
    </table>

    chevron_right

    
    

  • Td tag: It defines the standard cell in html document.

    Syntax:

    <td> Statements ... <td>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

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

    chevron_right

    
    

Input Tags:

  • Form tag: It is used to create html form for user.

    Syntax:



    <form> Statements ... <form>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <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>

    chevron_right

    
    

  • Submit input tag: It is used to take the input from the user.

    Syntax:

    <input>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <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>

    chevron_right

    
    

  • Dropdown option tag: It is used to select an option froma drop-down list.

    Syntax:

    <option> Statements ... <option>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <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

    chevron_right

    
    

  • Radio button tag: It is used to select only one option from the given options.

    Syntax:

    <input>
    

    Code:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <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 

    chevron_right

    
    



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.




Article Tags :
Practice Tags :


3


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.