All HTML Tags on Single Page


Introduction to HTML 
HTML stands for HyperText Markup language. it consists of tags which are the building blocks of a web page that defines the structure of a web that is why it is also known as structured language.

All browsers support HTML language. So almost all web developers have to know about HTML

A Basic Html Example
It is a simple HTML document example.


<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph. My first paragraph.</p>

</body>
</html>



Red: Red Tags are obsolete now either for one or all browsers so it’s better not to use them. Use alternate instead
Green: Green Tags are new in Html5.

So before starting learning anything about the HTML tag it is important to know about the comment tag and DocType declaration. I am listing these two on top of all the tags chart below.

<!-- --> This arrangement of angle brackets and special characters are used for comments in the HTML code. All browsers support this element. Any HTML code or plain text surrounded with this tag will be considered as a comment and will not be displayed in the browser.   

Example:

No.1

<!-- Commented area - The comment tag is used to insert comments in the source code and part of the source code itself-->

No.2

<!--<div>
  <h1>
    Heading 1
  </h1>
</div>-->

No.3

<div>
  <h2>
    Heading 2
  </h2>
</div>

The browser will show only Heading 2 because No.1 and No.2 are commented.

Note: Though the commented part of HTML will not be shown on the browser it still loaded in the browser you can see commented code by going to inspect element on the browser.

<!DOCTYPE>
All HTML documents start with this doctype declaration it is not case sensitive. It is "information" to the browser about what document type to expect.  

In HTML 5 declaration is simple:
<!DOCTYPE html> 

HTML Tags                                           Brief Description
 <a>                           Stands for anchor that is used to make hyperlink.
 <abbr>                      Used to write abbreviation of a long word.
 <acronym>               Defines acronym of a long word. This is not more in HTML5.
<address>                  This tag is used to define address.
 <applet>                   Used for embed a Java applet within an HTML document.
<area>                       The <area> tag defines an area inside an image-map.
 <article>                   It Defines an article.
 <aside>                     Used to write content related to the main web page.
 <audio>                    This element is used to embed audio in the document.
<b>                            b is for Bold it is use to make text bold.
<base>                       It defines default URL target for all links on a page.
<basefont>                Defines a default te xt color, font-family, font size for a page.
<bdi>                         Bi Directional Isolation used to isolate text from both side.
<bdo>                        Bi Directional Override used to reverse text to left or right.
<big>                         Make text bigger than normal text size.
<blockquote>            Used to quote text from another source.
<body>                      It defines the body of a html page.
<br>                           This tag is used to break a row.
<button>                    This tag creates a button.
<canvas>                    Defines a region to draw graphics.
<caption>                   Tag defines a table caption.
<center>                     This tag is used to align text in center.
<cite>                         Cite tag is used for title or reference to any work.
<code>                       Used to write in code style.
<col>                          Used to identify or specify column(s)
<colgroup>                 Used make column group.
<datalist>                   datalist element contains list of data within input tag.
<data>                        Used to link content with a machine-readable translation.
<dd>                           Used to define any term.   
<del>                          Used to show content as deleted.
<details>                    This element represents additional information.
<dfn>                          dfn represents the defining instance of a term.
<dir>                           Used to set the base direction of text for display,
<div>                          Div element represnts its children elements.
<dl>                            Consists the list of terms and there definition.
<dt>                            Used to dislpay term of the defination.
<em>                          Represents the emphasized text.
<embed>                    Used to embed an image in HTML.
<fieldset>                   Used to form controls grouped under a common name.
<figcaption>               It is used to define caption of figure(Image).
<figure>                     It is used to specify diagrams, photos, code etc.
<font>                        It is used to define font style of the text.
<footer>                     Defines footer of the page.
<form>                       Used to define form.
<frame>                     Defines one particular area.
<frameset>                This tag defines a set of frames.
<head>                       Head contains information about and for the the page.
<header>                    Contains headings of the document or information.
<hgroup>                   It is used as outer tag of h1-h6 tags.
<h1> – <h6>              Used to define headings of 1 to 6 sizes.
<hr>                           Used for draw a horizontal rule ( Line).
<html>                       Define the root of html document.
<i>                              Used to make text italic.
<iframe>                    Inline Frame contain the content from external recourse.
<img>                        Used to define or display image on the page.
<input>                      Used take input from user.
<ins>                          Use to show inserted text.
<kbd>                         Keyboard input text is specific style of text.
<keygen>                   This tag generates an encryption key.
<label>                       Used to write label of a input control.
<legend>                    Used to defines a caption for the <fieldset>.
<li>                            Used to list the things on the page.
<link>                        Links document and an external resource style sheet etc.
<main>                      main tag used to define main content of the page.
<map>                       Used to define clickable area on the image.
<mark>                      Used to mark text.
<menuitem>              It is used to define context menu items.
<menu>                     It is outer tag of <menuitem> defines the menu.
<meta>                      Used to define metadata of the page.
<meter>                     It’s a meter used to represent data.
<nav>                        Used to define navigation links.
<noframes>               Used to give a message if frameset support not available.
<noscript>                 Used to give message if JavaScript support not available.
<object>                    Used to embed objects like audio, video, image etc.
<ol>                           Defines ordered list of items.
<optgroup>                It is used to make groups of related options in dropdown.
<option>                    Option tag used to define options in dropdown list.
<output>                    It represents the result / output of some calculation.
<p>                            This tag used to write paragraph.
<param>                    Used to define parameter for the <object> tag.
<pre>                         Displays the text as it is formatted originally.
<progress>                Used to represent progress of work.
<q>                            It is used to quotes text.
<rp>                           Used to represent parentheses.
<rt>                            <rt> element is used to define pronunciation of the word.
<ruby>                       Ruby element are used for showing pronunciation.
<s>                             It specifies text which is no longer correct.
<samp>                      This is used to represent sample out of program.
<script>                      Used to embed or reference client side script.
<section>                   Define the section of the document like header, footer etc.
<select>                     Used to define dropdown.
<small>                      Small tag used write text in small size then normal.
<source>                    Used to specify media source for <audio> and <video> tags.
<span>                       It is used as Inline element.
<strike>                     Used to draw line in the middle of the text or word.
<strong>                    Strong is used to emphasis text.
<style>                      Used to style the HTML document.
<sub>                        Subscript  text appears below the middle of text.
<summary>               Defines the summary for the <details> tag.
<sup>                        Superscript text appears above the middle of text.
<table>                      Used to define table with rows and column fashion.
<tbody>                     Stands for table body it defines the body of the table.
<td>                           Short for the table data define cell for the data.
<textarea>                 It define multiline text input control.
<tfoot>                      It defines the footer of the table.
<th>                           It define the header of the table.
<thead>                     thead used to group the header content.
<time>                       This tag is used to define date/time.
<title>                        Used to define the title of the document.
<tr>                            It defines the table row of the cell in table.
<track>                       Used to define subtitle of the video & caption of the audio.
<tt>                             It is teletype text used to show text in <kbd> style.
<u>                             Used to underline the text.
<ul>                            Used to show unordered list items.
<var>                          Used to indicate a word as instance of a variable. 
<video>                      Video tag is use to embed video content.
<wbr>                         Used to avail word break opportunity.



1 comments:

Thanks for providing great informatic and looking beautiful blog, really nice required information & the things I never imagined, and I would request, wright more blog and blog post like that for us. Thank you once again
by Cloudi5
Web Design Company in Coimbatore

Post a Comment