Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>
Idioma: En

List of HTML Tags with their Uses and Purpose

In this tutorial, you will know about Html tags and their purpose. Learning HTML involves exact use of its tags to get desire result.

Introduction to HTML Tags

The HTML consists of a series of tags that provide instructions to a web browser in regard of displaying web page. Each tag consists of a pair (   > ), one is called starting tag and other ending tag (or close tag). Each tag has its own attributes, value and performance in Html Document. The starting tag is written between (greater-than sign), similarly the ending tag is also written between these signs but it is closed by using / (forward slash). A simple example of HTML tag is a pair of b tag " ". This tag is used to make a bold text, to make a word bold (or line) , the declaration (or writing method) is as follows:

Related Articles


 This line will be shown as bold.

All other tags are used in the above same way.
The following are the basic tags that are most commonly used in regard of designing/ developing websites.

Basic Tags Purpose
This tag defines the document type, it is written in the first line of html document. Such as, to declare HTML5 document, the statement will be as:
This tag describes the root of HTML document.
It is used to add comment in HTML source code to make easy for understanding and modification of the document. The using method of this tag is as follows:
This tag is used to write paragraph. By default, it displays as a block. The syntax of this tag is as follows:

Your 1st paragraph....

Your 2nd paragraph....

It is used to make bold text.
It is used to underline text.
It is used to make italic text.

to

These tags are used to indicate heading of paragraph or any other object of web page.
The "" tag is used to create a link to another webpage. The syntax of this tag is as follows:
the link anchor text goes here
such as, CodeHim home page >

It is used to break line. The text written after this tag, start from the new line. This tag has not end tag and it can be written as
or
both are correct.
This tag defines the possible line break.
It is used to show thematic change in a document. Like "br" tag, it also has no end tag. It can be written as
or
    and
The "ul" is stands for unordered list that is used to create a list. The "li" is the short of list item . This tag is used within unordered list or ordered list to indicate item/member of list.
Such as: The following is the list:

  • list item one

  • list item two

  • list item three

    		The "ol" is stands for ordered list that is used to create a list with numbering. The
  1. tag is also used within this tag.
    Such as: The following is list with numbers:

    1. list item one

    2. list item two

    3. list item three

    2. It is used to make a word or paragraph more important.
    For example, This is strong text.
    It is used to define content aside from the page content.
    In html document, this tag specifies the base URL/target for all relative URLs
    It is used to create different types of click able command buttons.
    It is used to defines the title of a work in HTML document.
    It is used to override the current text direction in document.
    		It is used to define the description list.
    		It is used to define a term in description list.
    		This tag defines the description of a term in description list.
    It is used to defining instance of a term.
    It is used to define a dialog box or window in the webpage.
    It is used to define emphasized text in the document.
    		It is used to create form for getting different types of input from the user.
    		It is used to make a group of related elements in a form
    It is used to add caption for
    element.
    It is used to indicate that a new text has been inserted into a document.
    It is used to control input.
    It is used to define a label for element. .
    This tag defines the keyboard input.
    		 It is used to quoted section (usually text) that is taken from another source.
    Such as:
    Confucius said,
    Everything has beauty, but not everyone can see.
    This tag is used to cutting a word or numbers from document, it draw a line on that word to show that the word has been deleted.
    Such as: to show price of any product, $15 rather than $25
    		It is used to show additional details about any topic that user can view or hide.
    This is additional details...
    This tag defines visible heading for
    tag. By default, details heading is "Details", this tag helps to customize this heading. Such as:
    Read More This is text to read more....
    		By default, this tag display data in a block (start from new line). It is used to create divisional section in the document.
    For example, in markup, there is no line break, but in output, each div tag starts from new line.
    This is first line text
    This is second line text
    It is used to highlight specific text in the document.
    Such as: HTML5 Tags List
    It is used to create a menu for different commands (including links).
    It is used to define items for element.
    It is used to define options menu. This tag is used inside the
    This tag is used to create a drop down menu (options menu). For example,
    It is used to insert abbreviation or an acronym in HTML document.
    Such as: HTML is the short of Hyper Text Markup Language.
    This tag defines an article. Article should be written within this tag.
    Such as: This is the body of article, all others tag like p, b, u, i table and lists are goes here.....
    It is used to add address of owner/author of the document. By default it displays as block and with italic font style.
    It is used to format a text in different direction from other text outside using css for this tag. By default, it hasn't any design and it displays as inline-block.
    It is used to insert code of computer program in HTML document.
    For example to show a C++ Hello world program, the syntax will be as:
    //C++ Hello World Program
    #include
    using namespace std;
    main()
      {
        cout
      }
      return 0;
    		It is also used to insert computer code in HTML document. The piece of code written between 
     and
    tag printed as it is written (including spaces, special characters, tab space and so on).
    For example to show a piece of CSS code, the syntax will be as: 
     /*css body and  paragraph design */
      body { margin: 0; 
            padding: 5px; 
            background: #f2f2f2; 
           color: #333;    } 
    p { font-size: 12pt; 
            text-align: left;   }
    It is used to make text smaller than other text in the document.
    This tag defines a section in HTML document. By default, it displays as in-line block and doesn't effects any other element. But it can be used for different styles using CSS.
    It is used to show a result of calculation or any other output of computer program.
    It is used to show scalar measurement within a known range.
    		It is used to indicate main content of the document. By default, it displays as block.
    It is used to add script in html document/webpage.
    It is used to show alternative contents if the browser does not execute scripts.
    This tag defines the subscripted text in the html document.
    This tag defines the superscripted text in the html document.
    This tag defines date and time
    This tag defines the text that is no longer correct.
    This tag defines a short quotation.
    This tag defines a ruby annotation.
    If browsers do not support ruby annotations, this tag defines what to show instead of element.
    This tag defines an explanation for characters.

    HTML Tags for Creating Table

    The following list of tags are are used to create and manage html tables.

    Tag Purpose and Meaning
    , , , tags. tag.
    It is used to create various kinds of tables in HTML document/webpage. This tag works along following
    ,
    and
    It indicates the body of the table.
    This tag groups the header content of the table.
    The "th" stands for Table Heading that is used to insert heading for the columns of table.
    The "tr" stands for Table Row that is used to insert row in table tag.
    The "td" stands for Table Data. This tag consists of table data (text, picture, lists, and so on) that will be shown on the webpage in a table.
    It is used to make a group of columns in a table.
    It indicates column properties for each column within a
    It is used to add caption for the table.
    This tag groups the footer content of the table.

    The structure of HTML table is as follows:

















    Heading of 1st column Heading of 2nd column
    The place for text The place for text
    The place for text The place for text

    HTML Header Area Tags

    The following tags are used for meta data and other purposes in html Document. These tags or not directly display to the user. These are written between

    tag of the webpage source code.
    Tag Purpose and Meaning
    It defines the information about html document.
    It defines the relationship between document and an external resource. It is used to add CSS file, JS or any external file to html document.
    It is used to add meta information in html document/webpage. This tag is most important for search engines to determine what the page about.
    This tag defines title of the webpage that shows on the title bar of the web browser and in search engine's result.
    It defines the style information for the webpage. CSS code is written between this tag.

    HTML Multimedia Tags

    The following group of tags are used to handle multimedia (such as photos, videos, audio etc) contents in html document/webpage.

    Tag Purpose
    It is used to insert an image to HTML document. The syntax of this tag is as follows:
    This tag defines a client-side image-map.
    It is used to define an area inside an image-map in html document.
    It is used to add sound clip to Web page.
    It is used to add video to a web page.
    It defines text for the media (audio and video) contents.
    It is used to draw various types of graphics (via scripting) in html document.
    It is used to insert an external non-HTML application.
    It defines an embedded object that may be a YouTube video or any other external application.
    This tag specifies media resources for audio and video on the website.
    		This tag specifies self-contained content in a web page.
    		It is used to define the caption for
    element.
    It defines a container for multiple image resources to create slide show on the website.
    It defines a container to insert SVG graphics in website.
    It is used to add a multiline text area in the document. Text area provide the ability to user to easily write, select and copy existing text.

    HTML Tags that no Longer Exists in HTML5

    The following 12 tags not supported in HTML 5. However, older versions of HTML (and some latest browser) still supporting these tags.

    HTML Older Version Tags Alternative
    It defines acronym. Use that is alternative to this.
    It defines an embedded applet. Use or instead of this tag.
    It defines big text. Use CSS "font-size" attribute to get desire text size.
    It is used to apply different styles on specific font/text in the document. Use CSS instead.
    This tag is used to set default font style like size, color etc for all text in document. Use CSS "font-style", "font-size" and "color" attributes to get your desire result.
    It defines directory list. Use
      ,
      instead of this.
    It is used to insert window in a frameset. Use CSS instead of this tag.
    It defines set of frames.
    It was used to provide alternative data to user without any frame.
    		This tag is used to align text (or any other object) to center.
    It is used to defines teletype text in document.
    It is used to define strikethrough text in the document. Use or instead of this tag.


    This post first appeared on Programming Explain, please read the originial post: here

    Share the post

    List of HTML Tags with their Uses and Purpose

    ×

    Subscribe to Programming Explain

    Get updates delivered right to your inbox!

    Thank you for your subscription

    ×