Scribd
Upload
6 views

HTML tags

The document is a comprehensive chart of HTML tags, providing examples of each tag's usage along with their browser view. It includes various categories such as text formatting, lists, forms, and tables, detailing how each tag is structured and displayed. The source of the chart is www.web-source.net.

Uploaded by

Mayowa Manga
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
6 views

HTML tags

The document is a comprehensive chart of HTML tags, providing examples of each tag's usage along with their browser view. It includes various categories such as text formatting, lists, forms, and tables, detailing how each tag is structured and displayed. The source of the chart is www.web-source.net.

Uploaded by

Mayowa Manga
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

HTML Tags Chart

source: www.web-source.net
Tag Name Code Example Browser View
<!--This can be viewed in the HTML part of a document-
<!-- comment Nothing will show
->
<A HREF="http://www.yourdomain.com/">Visit Our
<A - anchor Visit Our Site
Site</A>
<B> bold <B>Example</B> Example
<BIG> big (text) <BIG>Example</BIG> Example
body of
<BODY> <BODY>The content of your page</BODY> Contents of your webpage
document
The contents of your page<BR>The contents of your The contents of your page
<BR> line break
page The contents of your page
<CENTER> center <CENTER>This will center your contents</CENTER> This will center your contents
<DL>
Definition Term
<DT>Definition Term
Definition of the term
definition <DD>Definition of the term
<DD> Definition Term
description <DT>Definition Term
Definition of the term
<DD>Definition of the term
</DL>
<DL>
Definition Term
<DT>Definition Term
Definition of the term
definition <DD>Definition of the term
<DL> Definition Term
list <DT>Definition Term
Definition of the term
<DD>Definition of the term
</DL>
<DL>
Definition Term
<DT>Definition Term
Definition of the term
definition <DD>Definition of the term
<DT> Definition Term
term <DT>Definition Term
Definition of the term
<DD>Definition of the term
</DL>
This is an <EM>Example</EM> of using the emphasis This is an Example of using
<EM> emphasis
tag the emphasis tag
embed <EMBED src="yourfile.mid" width="100%" height="60"
<EMBED>
object align="center">

<EMBED src="yourfile.mid" autostart="true"


Music will begin playing when
embed hidden="false" loop="false">
<EMBED> your page is loaded and will only
object <noembed><bgsound src="yourfile.mid" loop="1">
play one time. A control panel
</noembed>
will be displayed to enable your
visitors to stop the music.
<FONT> font <FONT FACE="Times New Roman">Example</FONT> Example
<FONT FACE="Times New Roman"
<FONT> font
SIZE="4">Example</FONT> Example

<FONT> font
<FONT FACE="Times New Roman" SIZE="+3"
COLOR="#FF0000">Example</FONT> Example
<FORM action="mailto:[email protected]"> Name:
Name: <INPUT name="Name" value="" size="10"><BR>
Email:
<FORM> form Email: <INPUT name="Email" value="" size="10"><BR>
<CENTER><INPUT type="submit"></CENTER> Submit
</FORM>
Heading 1
Example
<H1> heading 1 <H1>Heading 1 Example</H1>

Heading 2
<H2> heading 2 <H2>Heading 2 Example</H2>
Example

<H3> heading 3 <H3>Heading 3 Example</H3>


Heading 3 Example

Heading 4 Example
<H4> heading 4 <H4>Heading 4 Example</H4>

Heading 5 Example
<H5> heading 5 <H5>Heading 5 Example</H5>

Heading 6 Example
<H6> heading 6 <H6>Heading 6 Example</H6>

heading of <HEAD>Contains elements describing the


<HEAD> Nothing will show
document document</HEAD>

horizontal Contents of your webpage


<HR> <HR>
rule
Contents of your webpage
Contents of your webpage
horizontal
<HR> <HR WIDTH="50%" SIZE="3">
rule
Contents of your webpage
Contents of your webpage
horizontal
<HR> <HR WIDTH="50%" SIZE="3" NOSHADE>
rule
Contents of your webpage
<HR> Contents of your webpage
horizontal
(Internet
rule <HR WIDTH="75%" COLOR="#FF0000" SIZE="4">
Explorer) Contents of your webpage
<HR> Contents of your webpage
horizontal
(Internet
rule <HR WIDTH="25%" COLOR="#6699FF" SIZE="6">
Explorer) Contents of your webpage
hypertext <HTML><HEAD><META><TITLE>Title of your
<HTML> markup webpage</TITLE></HEAD><BODY>Webpage Contents of your webpage
language contents</BODY></HTML>
<I> italic <I>Example</I> Example
<IMG SRC="Earth.gif" WIDTH="41" HEIGHT="41"
<IMG> image
BORDER="0" ALT="a sentence about your site">
Example 1:
Example 1:

<INPUT> input field <FORM METHOD=post ACTION="/cgi-bin/example.cgi">


<INPUT type="text" size="10" maxlength="30"> Submit
<INPUT type="Submit" VALUE="Submit">
</FORM>
<INPUT> input field Example 2: Example 2:
(Internet
Explorer) <FORM METHOD=post ACTION="/cgi-bin/example.cgi"> Submit
<INPUT type="text" STYLE="color: #FFFFFF; font-family:
Verdana; font-weight: bold; font-size: 12px; background-
color: #72A4D2;" size="10" maxlength="30">
<INPUT type="Submit" VALUE="Submit">
</FORM>
Example 3:

<FORM METHOD=post ACTION="/cgi-bin/example.cgi"> Example 3:


<TABLE BORDER="0" CELLSPACING="0"
<INPUT> input field CELLPADDING="2"><TR><TD BGCOLOR="#8463FF">
<INPUT type="text" size="10" MAXLENGTH="30"></TD> Submit
<TD BGCOLOR="#8463FF" VALIGN="Middle"> <INPUT
type="image" name="submit" src="yourimage.gif"></TD>
</TR> </TABLE>
</FORM>
Example 4:
Example 4:

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">


Enter Your Comments:<BR>
<INPUT> input field <TEXTAREA wrap="virtual" name="Comments" rows=3
cols=20 MAXLENGTH=100></TEXTAREA><BR>
<INPUT type="Submit" VALUE="Submit"> Submit Clear
<INPUT type="Reset" VALUE="Clear">
</FORM>
Example 5:

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">


<CENTER>
Select an option: Example 5:
<SELECT>
<OPTION >option 1
<INPUT> input field <OPTION SELECTED>option 2 Select an option: option 2
<OPTION>option 3 Submit
<OPTION>option 4
<OPTION>option 5
<OPTION>option 6
</SELECT><BR>
<INPUT type="Submit" VALUE="Submit"></CENTER>
</FORM>
Example 6:
Example 6:

Select an option:
<FORM METHOD=post ACTION="/cgi-bin/example.cgi">
Select an option:<BR> Option 1
<INPUT type="radio" name="option"> Option 1
<INPUT type="radio" name="option" CHECKED> Option 2 Option 2
<INPUT type="radio" name="option"> Option 3 Option 3
<INPUT> input field <BR>
<BR> Select an option:
Select an option:<BR>
<INPUT type="checkbox" name="selection"> Selection 1 Selection 1
<INPUT type="checkbox" name="selection" CHECKED>
Selection 2
Selection 2
<INPUT type="checkbox" name="selection"> Selection 3 Selection 3
<INPUT type="Submit" VALUE="Submit"> Submit
</FORM>

<LI> list item Example 1: Example 1:

<MENU> List item 1


<LI type="disc">List item 1 List item 2
<LI type="circle">List item 2
<LI type="square">List item 3 List item 3
</MENU>
Example 2:
Example 2:
i. List item 1
<OL type="i">
<LI>List item 1 ii. List item 2
<LI>List item 2 iii. List item 3
<LI>List item 3 iv. List item 4
<LI>List item 4
</OL>
Visit our <A
<LINK> link Visit our site
HREF="http://www.yourdomain.com/">site</A>
<MARQUEE> <MARQUEE bgcolor="#CCCCCC" loop="-1"
scrolling
(Internet scrollamount="2" width="100%">Example E
text
Explorer) Marquee</MARQUEE>
<MENU> List item 1
<LI type="disc">List item 1
<MENU> menu <LI type="circle">List item 2 List item 2
<LI type="square">List item 3 List item 3
</MENU>
<META name="Description" content="Description of your
site">
<META> meta Nothing will show
<META name="keywords" content="keywords describing
your site">
<META HTTP-EQUIV="Refresh"
<META> meta Nothing will show
CONTENT="4;URL=http://www.yourdomain.com/">
<META> meta <META http-equiv="Pragma" content="no-cache"> Nothing will show
<META> meta <META name="rating" content="General"> Nothing will show
<META> meta <META name="ROBOTS" content="ALL"> Nothing will show
<META> meta <META NAME="ROBOTS" content="NOINDEX,FOLLOW"> Nothing will show
Example 1:
Example 1:
<OL>
<LI>List item 1 1. List item 1
<LI>List item 2 2. List item 2
<LI>List item 3 3. List item 3
<LI>List item 4
</OL>
4. List item 4
<OL> ordered list
Example 2:
Example 2:

<OL type="a">
a. List item 1
<LI>List item 1 b. List item 2
<LI>List item 2 c. List item 3
<LI>List item 3 d. List item 4
<LI>List item 4
</OL>
<OPTION> listbox <FORM METHOD=post ACTION="/cgi-bin/example.cgi"> Select an option:
option <CENTER> option 2
Select an option:
<SELECT>
<OPTION>option 1
<OPTION SELECTED>option 2
<OPTION>option 3
<OPTION>option 4
<OPTION>option 5
<OPTION>option 6
</SELECT><BR>
</CENTER>
</FORM>
This is an example displaying the use of the paragraph This is an example displaying the
tag. <P> This will create a line break and a space use of the paragraph tag.
between lines.
This will create a line break and a
Attributes: space between lines.

Example 1:<BR>
Attributes:
<BR>
<P align="left">
This is an example<BR> Example 1:
displaying the use<BR>
of the paragraph tag.<BR> This is an example
<BR> displaying the use
<P> paragraph of the paragraph tag.
Example 2:<BR>
<BR>
<P align="right"> Example 2:
This is an example<BR>
displaying the use<BR> This is an example
of the paragraph tag.<BR> displaying the use
<BR> of the paragraph tag.
Example 3:<BR>
<BR> Example 3:
<P align="center">
This is an example<BR> This is an example
displaying the use<BR> displaying the use
of the paragraph tag. of the paragraph tag.
<SMALL> small (text) <SMALL>Example</SMALL> Example
strong
<STRONG> <STRONG>Example</STRONG> Example
emphasis
<TABLE> table Example 1: Example 1:
Column 1 Column 2
<TABLE BORDER="4" CELLPADDING="2"
CELLSPACING="2" WIDTH="100%">
<TR>
<TD>Column 1</TD> Example 2:
<TD>Column 2</TD>
</TR> Column 1 Column 2
</TABLE>

Example 2: (Internet Explorer)


Example 3:
<TABLE BORDER="2" BORDERCOLOR="#336699" Column 1 Column 2
CELLPADDING="2" CELLSPACING="2" WIDTH="100%"> Row 2 Row 2
<TR>
<TD>Column 1</TD>
<TD>Column 2</TD>
</TR>
</TABLE>

Example 3:

<TABLE CELLPADDING="2" CELLSPACING="2"


WIDTH="100%">
<TR>
<TD BGCOLOR="#CCCCCC">Column 1</TD>
<TD BGCOLOR="#CCCCCC">Column 2</TD>
</TR>
<TR>
<TD>Row 2</TD>
<TD>Row 2</TD>
</TR>
</TABLE>
<TABLE BORDER="2" CELLPADDING="2"
CELLSPACING="2" WIDTH="100%">
<TR>
<TD> table data <TD>Column 1</TD>
<TD>Column 2</TD> Column 1 Column 2
</TR>
</TABLE>
<DIV align="center"><TABLE>
<TR>
<TH>Column 1</TH>
<TH>Column 2</TH>
<TH>Column 3</TH>
</TR>
<TR>
<TD>Row 2</TD>
<TD>Row 2</TD>
<TD>Row 2</TD> Column 1 Column 2 Column 3
</TR> Row 2 Row 2 Row 2
table
<TH> <TR>
header Row 3 Row 3 Row 3
<TD>Row 3</TD>
<TD>Row 3</TD> Row 4 Row 4 Row 4
<TD>Row 3</TD>
</TR>
<TR>
<TD>Row 4</TD>
<TD>Row 4</TD>
<TD>Row 4</TD>
</TR>
</TABLE>
</DIV>
document Title of your webpage will be
<TITLE> <TITLE>Title of your webpage</TITLE>
title viewable in the title bar.
<TABLE BORDER="2" CELLPADDING="2"
CELLSPACING="2" WIDTH="100%">
<TR>
<TR> table row <TD>Column 1</TD> Column 1 Column 2
<TD>Column 2</TD>
</TR>
</TABLE>
<TT> teletype <TT>Example</TT> Example
<U> underline <U>Example</U> Example
Example 1:<BR> Example 1:
<BR>
<UL>
<LI>List item 1 List item 1
<LI>List item 2
</UL> List item 2
<BR>
unordered Example 2:<BR>
<UL>
list <UL type="disc"> Example 2:
<LI>List item 1
<LI>List item 2 List item 1
<UL type="circle">
<LI>List item 3 List item 2
<LI>List item 4 List item 3
</UL> List item 4
</UL>
| Web Site Development | HTML Codes | HTML Tips | Javascript Snippets |
| Web Resources | 216 Safe Colors | Symbols | Web Development Strategies | Web Site Templates |
| Contact Us | About | Privacy Policy | Terms & Conditions | Site Map | Advertise | Affiliate Program |

Web-Source.net http://www.web-source.net
Your Guide to Professional Web Site Design and Development
Hosted with Host4Profit.
Copyright © 1997-2023 Brajusta Publishing, Inc., All Rights Reserved

You might also like