List of HTML 4 tags



Name
Attributes
End Tag
Description
<A>
accesskey="accessibility key character"
charset="character encoding of linked source"
class="class name"
coords="client-side image maps coordinates"
dir="direction for weak/neutral text"
href="URL for linked resource"
hreflang="language code"
id="document-wide unique id"
lang="language code"
name="name of target location"
onblur="script"
onclick="script"
ondblclick="script"
onfocus="script"
onhelp="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
rel="forward link types"
rev="reverse link types"
shape="client-side image maps coordinates"
style="associated style info"
tabindex="position in tabbing order"
target="frame target, in case page is using the frames"
title="advisory title"
type="content type"
</A>

The A element is used to make the links, e.g

<A href="abc123.html">click here to open the link </A>

this will look on the browser like

click here to open the link

and when you will click on the above link, it will open the site abc123.com

<ABBR>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</ABBR>

The ABBR element is used to describe an abbreviated form (e.g. WWW)

e.g

<ABBR title="World Wide Web">WWW</ABBR>

This allows author to clearly indicate that it is the abbreviation

 

<ACRONYM>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</ACRONYM>
The ACRONYM element indicates an acronym and its purpose is similar to ABBR tag
<ADDRESS>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</ADDRESS>

The ADDRESS element is used to provide the information on author. This element may be used by authors to supply contact information for a document.

e.g

<ADDRESS>
<A href="abc/">abc</A>,
contact persons for the <A href="Activity">HTML Tutorial</A><BR>
</ADDRESS>


On browser it will look like


abc, contact persons for the HTML Tutorial

<APPLET>
align="vertical or horizontal alignment"
alt="short description"
archive="comma-separated archive list"
class="class name"
code="applet class file"
codebase="optional base URI for applet"
height="initial height"
hspace="horizontal gutter"
id="document-wide unique id"
name="unique name"
object="name of applet file"
style="associated style info"
title="advisory title"
vspace="vertical gutter"
width="initial width"
</APPLET>

The APPLET element is used to insert a java applet and is deprecated

 

<AREA>
accesskey="accessibility key character"
alt="short description"
class="class name"
coords="client-side image maps coordinates"
dir="direction for weak/neutral text"
href="URI for linked resource"
id="document-wide unique id"
lang="language code"
nohref
onblur="script"
onclick="script"
ondblclick="script"
onfocus="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
shape="client-side image maps coordinates"
style="associated style info"
tabindex="position in tabbing order"
target="frame target"
title="advisory title"
Forbidden

The AREA element is used to define a client-side image map area. The image seen on the browser may have the hyper link and the area in which the link will be activated is defined by this tag

e.g

<IMG src="img1.gif" width="126" height="90" usemap="#Map" border="0">
<MAP name="Map">
<AREA shape="rect" coords="22,16,103,65" href="abc.htm" target="_self">
</MAP>

On the image named img1.gif, the rectangular area with the screen coordinates "22,16,103,65" will have a hyperlink to "abc.htm"

<B>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</B>

The B element is used to write the text in bold characters.

e.g

<B>
< FONT color="#000099">
This text is bold
</FONT>
</B>


On the browser it will look like


This text is bold

<BASE>
href="URI for linked resource"
target="frame target"
Forbidden

The BASE element allows authors to specify a document's base URL explicitly and if present comes under the HEAD section

e.g

<HTML>
<HEAD>
<TITLE>Base example</TITLE>
<BASE href="http://www.abc.com/index.html">
</HEAD>
<BODY>
<P>Click here to see other <A href="examples/examples.html">examples</A>
</BODY>
</HTML>

here other examples will be in http://www.abc.com/examples/examples.html


<BASEFONT>
color="color"
face="font name(s)"
id="document-wide unique id"
size="1-7 (+/-)"
Forbidden
The BASEFONT element is used to specify base font size and is deprecated.
<BDO>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
style="associated style info"
title="advisory title"
</BDO>
The BDO element is used in scenarios where absolute control over sequence order is required for example... to override the default text direction.

e.g.

<BDO dir="rtl">
Here is some Hebrew text
</BDO>



On the browser it will look like

Here is example of BDO tag
<BIG>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</BIG>

The BIG element displays the text in the bigger font

e.g

<FONT color="#000099">
normal text <BR>
<BIG>bigger text </BIG></FONT>


On the browser it will look like


normal text
bigger text

<BLOCKQUOTE>
cite="URL of source information"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</BLOCKQUOTE>

The BLOCKQUOTE element is used to show the block-level content, by entering the long quotation

e.g

<FONT color="#000099">
<B>This text is not blockquoted.
<BR>
<BLOCKQUOTE>This text is blockquoted.</BLOCKQUOTE>
</B></FONT>


On the browser it will look like


This text is not blockquoted.

This text is blockquoted.
<BODY>
alink="color name"
background="URL of background image"
bgcolor="color name"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
link="color name"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onload="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
onunload="script"
style="associated style info"
text="color name"
title="advisory title"
vlink="color name"
</BODY>
(Optional)

The BODY element is used to display the content of the page. This is what we see as the web page, all the tags except HTML, HEAD and its sub tags comes under the body tag

<HTML>
<HEAD>
<TITLE>Title</TITLE>
<BODY>Web page content</BODY>
</HTML>


On the browser it will show


Web page content

<BR>
class="class name"
clear="left - all - right - none"
id="document-wide unique id"
style="associated style info"
title="advisory title"
Forbidden

The BR element is used to enter a forced line break

e.g

<FONT color="#000099"><B>
<P> Hi! <BR> How are you ??</P>
</B></FONT>

On the browser it will look like


Hi!
How are you ??

<BUTTON>
accesskey="accessibility key character"
class="class name"
dir="direction for weak/neutral text"
disabled
id="document-wide unique id"
lang="language code"
name="name of target location"
onblur="script"
onclick="script"
ondblclick="script"
onfocus="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
tabindex="position in tabbing order"
title="advisory title"
type="content type"
value="value"
</BUTTON>

The BUTTON element is used to insert a push button on the web page

e.g

<FORM name="form1" method="post" action="abc.asp">
<BUTTON name="submit" value="submit" type="submit">
Send</BUTTON></FORM>


On the browser it will look like


 

<CAPTION>
align="left - center - right - justify - char"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</CAPTION>

The CAPTION element describes the table heading

e.g

<TABLE width="50%" border="1" bgcolor="#33CCFF">
<CAPTION>Alphabets table</CAPTION>
<TR>
<TD width="50%">ABCDEFGH</TD>
<TD width="50%">abcdefgh</TD>
</TR>
</TABLE>


On the browser it will look like


 

Alphabets table
ABCDEFGH abcdefgh
<CENTER>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</CENTER>

This CENTER element aligns the text to the center and is deprecated.

 

<CITE>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</CITE>

The CITE element is used for the text citation.

e.g

<FONT color="#000099"><B>
<CITE>
This is cite text </CITE></B></FONT>


On the browser it will look like


This is cite text

<CODE>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</CODE>

This makes the text looks like a computer code text

e.g

<FONT color="#000099"><B>
<CODE>
This is a code text. </CODE></B></FONT>


On the browser it will look like


This is a code text.

<COL>
align="left - center - right - justify - char"
char="character"
charoff="number"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
span="number"
style="associated style info"
title="advisory title"
valign="top - middle - bottom - baseline"
width="column width specification"
Forbidden

The COL element allows authors to group together attribute specifications for table columns. The COL does not group columns together structurally -- that is the role of the COLGROUP element. COL elements are empty and serve only as a support for attributes. They may appear inside or outside an explicit column group.

<TABLE width="80%" border="1" bgcolor="#33CCFF">
<TR>
<COL width="20%" span="1" align="right">
<COL width="80%">
</TR>
<TR>
<TD>1</TD>
<TD>2</TD>
<TR>
</TABLE>


On the browser it will look like


1 2

 

<COLGROUP>
align="left - center - right - justify - char"
char="character"
charoff="number"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
span="number"
style="associated style info"
title="advisory title"
valign="top - middle - bottom - baseline"
width="column width specification"
</COLGROUP>
O

The COLGROUP element allows authors to create structural divisions within a table.

e.g

<TABLE width="50%" border="1" bgcolor="#FFCC00">
<COLGROUP width="20">
<COL span="2" align="right" >
<COL span="1" align="left" >
</COLGROUP>
<CAPTION>Colours</CAPTION>
<TR>
<TD width="25%">Red</TD>
<TD width="25%">Blue</TD>
<TD width="25%">Green</TD>
</TR>
</TABLE>


On the browser it will look like


Colours
Red Blue Green


<DD>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</DD>
O

The DD element is used to provide the definition description of any term in the Definition List

<DL>
<DT><B><FONT color="#990000">EM</FONT></B>
<DD>This tag is used for the text emphasis
</DL>


On the browser it will look like



EM
This tag is used for the text emphasis
<DEL>
cite="URL of source information"
datetime="date"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
onselectstart="script"
style="associated style info"
title="advisory title"
</DEL>

The DEL element is used to show the modified document and marks the text as deleted text.

e.g

<DEL><FONT color="#CC6600">This is deleted text</FONT></DEL>


On the browser it will look like


This is deleted text

<DFN>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</DFN>

The DFN element is used to suggest that the word is a definition.

e.g

<p><font color="#000099"><dfn>URL</dfn> is the acronym for the Universal Resourse Locator</font></p>


On the bowser it will look like


URL is the acronym for the Universal Resourse Locator.

<DIR>
class="class name"
compact
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</DIR>
The DIR element is used to for directory list and is deprecated.
<DIV>
align="left - center - right - justify - char"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</DIV>

The DIV element is used to display the block level information and adds the structure to the page.

e.g

<P><font color="#000099">This is<DIV align="center">an example</DIV><DIV align="center" >of<P>div tag </DIV></font>


On the browser it will look like

This is

an exmple
of

div tag

<DL>
class="class name"
compact
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</DL>

The DL element is used for definition list

e.g

<DL>
<DT>EM
<DD>This tag is used for the emphasis
<DT>B
<DD>This tag is used for the bold text
</DL>


On the browser it will look like


EM
This tag is used for the emphasis
B
This tag is used for the bold text
<DT>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
Optional

The DT element is used for definition term

e.g

<DL>
<DT><B><FONT color="#000099">EM</FONT></B>
<DD>This tag is used for the emphasis
<DT><B><FONT color="#000099">B</FONT></B>
<DD>This tag is used for the bold text
</DL>


On the browser it will look like


EM
This tag is used for the emphasis
B
This tag is used for the bold text
<EM>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</EM>

The EM element is used to emphasise the text

e.g

<EM><FONT color="#000099">This is an emphasised text</FONT></EM>


On the browser it will look like.

This is an emphasised text

<FIELDSET>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</FIELDSET>

The FIELDSET element is used to group related controls and labels based on the category or theme.

e.g

<FORM name="form2" method="post" action=""><P>
<FIELDSET><LEGEND> Personal Information</LEGEND> First Name
<INPUT type="text" name="textfield">
<BR>
Last Name
<INPUT type="text" name="textfield2">
</FIELDSET>
<BR>
<FIELDSET><LEGEND>Qualification</LEGEND>
Education Qualification
<INPUT type="text" name="textfield3">
<BR>
Professional qualification
<INPUT type="text" name="textfield4">
</FIELDSET></P>
</FORM>

Personal Information First Name
Last Name

Qualification Education Qualification
Professional qualification

 

<FONT>
class="class name"
color="color"
dir="direction for weak/neutral text"
face="font name(s)"
id="document-wide unique id"
lang="language code"
size="1-7 (+/-)"
style="associated style info"
title="advisory title"
</FONT>
The FONT element is used for local change to font and is deprecated.
<FORM>
accept-charset="list of supported charsets"
action="URL of server-side form handler"
class="class name"
dir="direction for weak/neutral text"
enctype="content type"
id="document-wide unique id"
lang="language code"
method="get - post"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
onreset="script"
onsubmit="script"
style="associated style info"
target="frame target"
title="advisory title"
</FORM>

The FORM element is used to add the interactivity to the web page and acts as a container for the form objects e.g List box, text box

e.g

<FORM name="form3" method="post" action="">
<P>Enter the password
<INPUT type="text" name="textfield5">
</P>
<P>
<INPUT type="submit" name="Submit" value="Submit">
</P>
</FORM>

Enter the password

 

<FRAME>
class="class name"
frameborder="0 - 1"
id="document-wide unique id"
longdesc="link to long description"
marginheight="pixels"
marginwidth="pixels"
name="name of target location"
noresize
scrolling="yes - no - auto"
src="source of frame content"
style="associated style info"
title="advisory title"
Forbidden

The FRAME element is used to divide the page into subwindows and each subwindow is called the frame.

e.g

<FRAMESET rows="80,*" frameborder="NO" border="0" framespacing="0">
<FRAME name="topFrame" scrolling="NO" noresize src="one.html" >
<FRAME name="mainFrame" src="two.html">
</FRAMESET>

This code will divide the page into two subwindows and each will have different html pages as source file.

<FRAMESET>
class="class name"
cols="list of lengths"
id="document-wide unique id"
onload="script"
onunload="script"
rows="list of lengths"
style="associated style info"
title="advisory title"
</FRAMESET>
The FRAMESET element is used with FRAME element to divide the page.
H1,H2,H3
H4,H5,H6
align="left - center - right - justify - char"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</H#>

The HEADING element is used to show the heading

e.g

<FONT color="#000099">
<H1>Heading 1</H1>
<H2> Heading 2</H2>
<H3> Heading 3</H3>
<H4> Heading 4</H4>
<H5> Heading 5</H5>
</FONT>


On the browser it will look like


 

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

 

<HEAD>
dir="direction for weak/neutral text"
lang="language code"
profile="URL"
</HEAD>
Optional
The HEAD element is used to provide the information about the current document, such as its title, keywords.
<HR>
align="left - center - right"
class="class name"
id="document-wide unique id"
noshade
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
size="pixels"
style="associated style info"
title="advisory title"
width="percentage - pixels"
Forbidden

The HR element is used to insert a horizontal rule

e.g

<HR width="100%" size="4">


On the browser it will look like



 

<HTML>
dir="direction for weak/neutral text"
lang="language code"
version="URL"
</HTML>
Optional
The HTML element is used to indicate the html document , it is document root element and all the other tags are contained in it.
<I>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</I>

The I element is used to display the text in italic style.

e.g

<I><FONT color="#000066">
<B>This is an italic styled text</B></FONT></I>


On the browser it will look like


This is an italic styled text

<IFRAME>
align="left - middle - right - top"
class="class name"
frameborder="0 - 1"
height="percentage - pixels"
id="document-wide unique id"
longdesc="URL"
marginheight="pixels"
marginwidth="pixels"
name="name of target location"
scrolling="yes - no - auto"
src="source of frame content"
style="associated style info"
title="advisory title"
width="frame width specification"
</IFRAME>

The IFRAME element is used to insert an inline subwindow within a block of text.

e.g

<IFRAME src="tutorials.html" width="300" height="400"
scrolling="auto" frameborder="1">
[Your user agent does not support frames or is currently configured
not to display frames. However, you may visit
<A href="tutorials.html">the related document.</A>]
</IFRAME>


On the browser it will look like



<IMG>
align="left - middle - right - top"
alt="short description"
border="pixels"
class="class name"
dir="direction for weak/neutral text"
height="pixels"
hspace="pixels"
id="document-wide unique id"
ismap
lang="language code"
longdesc="URL"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
src="URL of image"
style="associated style info"
title="advisory title"
usemap="URL of client-side image map"
vspace="pixels"
width="image width"
Forbidden

The IMG element is used to embed image in the html document.

e.g

<img src="img1.gif" width="126" height="90" border="2">


On the browser it will look like


<INPUT>
accept="MIME types"
accesskey="accessibility key character"
align="left - middle - right - top"
alt="text"
checked
class="class name"
dir="direction for weak/neutral text"
disabled
id="document-wide unique id"
lang="language code"
maxlength="max chars for text field"
name="name of target location"
onblur="script"
onchange="script"
onclick="script"
ondblclick="script"
onfocus="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
onselect="script"
readonly
size="field size"
src="URL of image"
style="associated style info"
tabindex="number"
title="advisory title"
type="input type/text"
usemap="URL of image map"
value="value"
Forbidden

The INPUT element is used to insert the form control to provide the interactivity to the html document.

e.g

<FORM name="form4" method="post" action="abc.asp">
Please enter the password
<INPUT type="password" name="pwd">
</FORM>


On the browser it will look like


Please enter the password

 

<INS>
cite="URL of source information"
class="class name"
datetime="date and time of change"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</INS>

The INS element is used for inserted text

e.g

<INS> This is an inserted text</INS>


On the browser it will look like


  This is an inserted text

<ISINDEX>
class="class name"
dir="direction for weak/neutral text"
href="URI for linked resource"
id="document-wide unique id"
lang="language code"
prompt="message"
style="associated style info"
title="advisory title"
Forbidden
The ISINDEX to used to indicate the single line prompt and is deprecated.
<KDB>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</kbd>
The KDB element is used to indicate that text to be entered is by the user
<LABEL>
accesskey="accessibility key character"
class="class name"
dir="direction for weak/neutral text"
for="field ID value"
id="document-wide unique id"
lang="language code"
onblur="script"
onclick="script"
ondblclick="script"
onfocus="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</LABEL>

The LABEL element is used for form field label text.

e.g

<FORM action="..." method="post">
<TABLE>
<TR>
<TD><LABEL for="fname">First Name</LABEL>
<TD><INPUT type="text" name="firstname" id="fname">
<TR>
<TD><LABEL for="lname">Last Name</LABEL>
<TD><INPUT type="text" name="lastname" id="lname">
</TABLE>
</FORM>


On the browser it will look like


<LEGEND>
accesskey="accessibility key character"
align="left - right - bottom - top"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
 

The LEGEND element is used to assign a caption to a fieldset, i.e label to the fieldset

e.g

<FORM name="form2" method="post" action=""><P>
<FIELDSET><LEGEND> Personal Information</LEGEND> First Name
<INPUT type="text" name="textfield">
<BR>
Last Name
<INPUT type="text" name="textfield2">
</FIELDSET>
<BR>
<FIELDSET><LEGEND>Qualification</LEGEND>
Education Qualification
<INPUT type="text" name="textfield3">
<BR>
Professional qualification
<INPUT type="text" name="textfield4">
</FIELDSET></P>
</FORM>

Personal Information First Name
Last Name

Qualification Education Qualification
Professional qualification

 

<LI>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
type="content type"
value="value"
</LI>
Optional

The LI element is used to list item.

e.g

<FONT color="#000099"><b>
<OL>
<LI value="20"> This is 20.
<LI value="30"> This is 30.
<LI> This is 31.</b>
</OL>
</FONT>


On the browser it will look like


  1. This is 20.
  2. This is 30.
  3. This is 31.
<LINK>
charset="character encoding of linked source"
class="class name"
dir="direction for weak/neutral text"
href="URI for linked resource"
hreflang="language code"
id="document-wide unique id"
lang="language code"
media="media type"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
rel="forward link types"
rev="reverse link types"
style="associated style info"
target="frame target"
title="advisory title"
type="content type"
Forbidden

The LINK element is used to define a link and is defined under the head section.

e.g

<HEAD>
<TITLE>Language lesson</TITLE>
<LINK rel="Index" href="../index.html">
<LINK rel="Next" href="next.html">
<LINK rel="Prev" href="prev.html">
</HEAD>

<MAP>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
name="name of target location"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</MAP>

The MAP element is used to define the client-side image map

e,g

<IMG src="img1.gif" width="126" height="90" usemap="#Map" border="0">
<MAP name="Map">
<AREA shape="rect" coords="22,16,103,65" href="abc.html" target="_self">
</MAP>

On the image named img1.gif, the rectangular area with the screen coordinates "22,16,103,65" will have a hyperlink to "abc.htm"

<MENU>
class="class name"
compact
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</MENU>
The MENU element is used to define single column menu lists and is deprecated
<META>
content="associated information"
dir="direction for weak/neutral text"
http-equiv="http response header name"
lang="language code"
name="name of target location"
scheme="select form of content"
Forbidden
The META element is used to identify generic properties of a document e.g., author, expiration date, a list of key words, etc.
<NOFRAMES>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</NOFRAMES>

The NOFRAME element is used to specify the alternate content container for non frame-based browsers

e.g

<HTML>
<HEAD>
<TITLE>NOFRAMES example</TITLE>
</HEAD>
<FRAMESET cols="50%, 50%">
<FRAME src="keywordslisting.htm">
<FRAME src="buildseopages.htm">
<NOFRAMES>
<P>Here is the <A href="main-noframes.htm">
non-frame based version of the document.</A>
</NOFRAMES>
</FRAMESET>
</HTML>

The link to main-noframes.htm will be shown when the user agent doesn't support the frames.

<NOSCRIPT>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</NOSCRIPT>

The NOSCRIPT element is used to specify the alternate content when a script is not being executed by the user agaent/explorer

e.g

<SCRIPT">
...script is defined here in javascript or vbscript...
</SCRIPT>
<NOSCRIPT>
<P>Please go to the page <A href="http://noscript.html">noscript.</A> in case the script is not executed
</NOSCRIPT>

<OBJECT>
align="left - right - bottom - top - middle"
border="percentage - pixels"
class="class name"
classid="id"
codebase="URL for classid, data, archive"
codetype="content type for code"
data="URL to data"
declare
dir="direction for weak/neutral text"
height="percentage - pixels"
hspace="percentage - pixels"
id="document-wide unique id"
lang="language code"
name="name of target location"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
standby="message to show while loading"
style="associated style info"
tabindex="position in tabbing order"
title="advisory title"
type="content type"
usemap="URL to client-side image map"
vspace="percentage - pixels"
width="column width specification"
</OBJECT>

The OBJECT element is used to embed the object e.g image, applet in the html document.

e.g

<OBJECT id="obj1">
<PARAM name="param1">
</OBJECT>

 

<OL>
class="class name"
compact
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
start="starting sequence number"
style="associated style info"
title="advisory title"
type="content type"
</OL>

The OL element is used to specify the ordered list

<FONT color="#000099"><b>
<OL>
<LI value="20"> This is 20.
<LI value="30"> This is 30.
<LI> This is 31.</B>
</OL>
</FONT>


On the browser it will look like


  1. This is 20.
  2. This is 30.
  3. This is 31.

 

<OPTGROUP>
class="class name"
dir="direction for weak/neutral text"
disabled
id="document-wide unique id"
label="text"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</OPTGROUP>

The OPTGROUP element is used to group the options in the list box

e.g

<SELECT name="select">
<OPTION selected label="none" value="none">None</OPTION>
<OPTGROUP label="Personal Information">
<OPTION value="fn">First Name</option>
<OPTION value="ln">Last Name</option>
</OPTGROUP>
<OPTGROUP label="Qualification">
<OPTION value="ed">Educational Degree</option>
<OPTION value="pd">Professional Degree</option>
</OPTGROUP>
</SELECT>


On the browser it will look like


 

<OPTION>
class="class name"
dir="direction for weak/neutral text"
disabled
id="document-wide unique id"
label="text"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
selected
style="associated style info"
title="advisory title"
value="value"
Optional

The OPTION element is used to define the selectable choice.

e.g

<SELECT name="select2">
<OPTION value="fo" selected>First Option</option>
<OPTION value="so">Second Option</option>
<OPTION value="to">Third Option</option>
</SELECT>


On the browser it will look like


 

<P>
align="left - center - right - justify"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</P>
Optional

The P element is used to represent the paragraph

e.g

<P>This is a paragraph</P>


On the browser it will look like


This is a paragraph

<PARAM>
id="document-wide unique id"
name="name of target location"
type="content type"
value="value"
valuetype="data - ref - object"
Forbidden

The PARAM element is used to specify a set of values that may be required by an object at run-time

e.g

<OBJECT id="add" classid="add.class">
<PARAM name="param1" value="1">
<PARAM name="param2" value="2">
</OBJECT>

The above example is using the class add to add the two numbers whose values are being passed with the PARAM element

<PRE>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
width="width specification"
</PRE>

The PRE element is used to specify the preformatted text

e.g

<FONT color="#000099"><B>
<PRE>
Hello.....
        This is a preformatted text...
                 It will look like this on the browser....
</PRE>
</B></FONT>


On the browser it will look like this


Hello.....
        This is a preformatted text...
                 It will look like this on the browser....

 

<Q>
cite="URL of source information"
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</Q>

The Q element is used for short inline quotation

e.g

<Q> This is short inilne quotation </Q>


On the browser it will look like


This is short inilne quotation

<S>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</S>
The S element is used to strike through the text and is deprecated.
<SAMP>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</SAMP>

The SAMP element is used to sample program output, scripts, etc.

e.g

<FONT color="#000099"><B><P>If you select the 'add' option, you will be prompted with the message
<SAMP>Please enter the numbers
</SAMP>
</P></B></FONT>


On the browser it will look like this


If you select the 'add' option, you will be prompted with the message Please enter the numbers.

<SCRIPT>
charset="character encoding of linked source"
defer
event="name of event"
for="element ID"
language="predefined script language name"
src="URL of code"
type="content type"
</SCRIPT>

The SCRIPT element is used for script statements

e.g

<SCRIPT type="text/javascript">
function alertsignal()
{
alert('LION! LION!');
}
</SCRIPT>

This script when executed will pop up an alert window

<SELECT>
class="class name"
dir="direction for weak/neutral text"
disabled
id="document-wide unique id"
lang="language code"
multiple name="name of target location"
onblur="script"
onchange="script"
onclick="script"
ondblclick="script"
onfocus="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
size="number"
style="associated style info"
tabindex="position in tabbing order"
title="advisory title"
 

The SELECT element is used to create the menu.

e.g

<SELECT name="select2">
<OPTION value="fo" selected>First Option</option>
<OPTION value="so">Second Option</option>
<OPTION value="to">Third Option</option>
</SELECT>


On the browser it will look like this


 

<SMALL>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</SMALL>

The SMALL element is used to display the text in small style.

e.g

<FONT color="#000099"><b>
<SMALL>This is a small text style</SMALL>
</b></FONT>


On the browser it will look like


This is a small text style

<SPAN>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</SPAN>
The SPAN element is used to with CSS to provide structure in the html document.
<STRIKE>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</STRIKE>
The STRIKE element is used to strike-through the text and is deprecated.
<STRONG>
class="class name"
dir="direction for weak/neutral text"
id="document-wide unique id"
lang="language code"
onclick="script"
ondblclick="script"
onkeydown="script"
onkeypress="script"
onkeyup="script"
onmousedown="script"
onmousemove="script"
onmouseout="script"
onmouseover="script"
onmouseup="script"
style="associated style info"
title="advisory title"
</STRONG>

The STRONG element is used to make the text look like strongly emphasised.

e.g

<FONT color="#000099">
<STRONG>This is a strong text style</STRONG>
</FONT>


On the browser it will look like


This is a strong text style

<STYLE>
dir="direction for weak/neutral text"
lang="language code"
media="media type"
title="advisory title"
type="content type"
</STYLE>
The STYLE element is used to provide the style info
<SUB>