Scribd
Upload
2 views

HTML tags

The document is a comprehensive HTML tags chart that provides a list of various HTML tags, their names, code examples, and how they appear in a browser. It includes tags for comments, links, formatting, lists, forms, and tables, along with their respective usage and visual representation. This resource serves as a reference for understanding and implementing HTML elements in web development.

Uploaded by

xvpbfgj4y5
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
2 views

HTML tags

The document is a comprehensive HTML tags chart that provides a list of various HTML tags, their names, code examples, and how they appear in a browser. It includes tags for comments, links, formatting, lists, forms, and tables, along with their respective usage and visual representation. This resource serves as a reference for understanding and implementing HTML elements in web development.

Uploaded by

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

HTML Tags Chart

source: www.web-source.net
Tag Name Code Example Browser View
<!--This can be viewed in the HTML part of a
<!-- comment Nothing will show
document-->
<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 The contents of your page
<BR> line break
your page The contents of your page
<CENTER>This will center your This will center your
<CENTER> center
contents</CENTER> contents
Definition Term
<DL>
Definition of the
<DT>Definition Term
term
definition <DD>Definition of the term
<DD> Definition Term
description <DT>Definition Term
Definition of the
<DD>Definition of the term
term
</DL>

Definition Term
<DL>
Definition of the
<DT>Definition Term
term
definition <DD>Definition of the term
<DL> Definition Term
list <DT>Definition Term
Definition of the
<DD>Definition of the term
term
</DL>

Definition Term
<DL>
Definition of the
<DT>Definition Term
term
definition <DD>Definition of the term
<DT> Definition Term
term <DT>Definition Term
Definition of the
<DD>Definition of the term
term
</DL>

This is an <EM>Example</EM> of using This is an Example of using


<EM> emphasis
the emphasis tag the emphasis tag
embed <EMBED src="yourfile.mid" width="100%"
<EMBED>
object height="60" align="center">

<EMBED src="yourfile.mid" autostart="true" Music will begin playing


<EMBED> embed hidden="false" loop="false"> when your page is loaded

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 1 of 9
:
object <noembed><bgsound src="yourfile.mid" loop="1"> and will only play one time.
</noembed> A control panel will be
displayed to enable your
visitors to stop the music.
<FONT FACE="Times New
<FONT> font
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: <INPUT name="Name" value="" size="10"> Name:
<BR>
Email:
<FORM> form Email: <INPUT name="Email" value="" size="10">
<BR> Submit
<CENTER><INPUT type="submit"></CENTER>
</FORM>

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

Heading 3
<H3> heading 3 <H3>Heading 3 Example</H3> 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

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 2 of 9
:
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 <HR WIDTH="75%" COLOR="#FF0000"
(Internet
rule SIZE="4">
Explorer) Contents of your webpage
<HR> Contents of your webpage
horizontal <HR WIDTH="25%" COLOR="#6699FF"
(Internet
rule 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:
<FORM METHOD=post ACTION="/cgi-
<INPUT> input field bin/example.cgi">
Submit
<INPUT type="text" size="10" maxlength="30">
<INPUT type="Submit" VALUE="Submit">
</FORM>
Example 2:

<FORM METHOD=post ACTION="/cgi-


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

<FORM METHOD=post ACTION="/cgi-


bin/example.cgi">
<TABLE BORDER="0" CELLSPACING="0" Example 3:
CELLPADDING="2"><TR><TD
<INPUT> input field BGCOLOR="#8463FF"><INPUT type="text"
size="10" MAXLENGTH="30"></TD><TD
BGCOLOR="#8463FF" VALIGN="Middle">
<INPUT type="image" name="submit"

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 3 of 9
:
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> Submit Clear
<INPUT type="Submit" VALUE="Submit">
<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 Select an option:
<INPUT> input field <OPTION SELECTED>option 2 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:

<FORM METHOD=post ACTION="/cgi- Example 6:


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

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 4 of 9
:
<INPUT type="Submit" VALUE="Submit">
</FORM>
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>
<LI> list item
Example 2: Example 2:

<OL type="i"> i. List item 1


<LI>List item 1 ii. List item 2
<LI>List item 2
iii. List item 3
<LI>List item 3
<LI>List item 4 iv. 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
Example Marquee
text
Explorer) Marquee</MARQUEE>
<MENU> List item 1
<LI type="disc">List item 1
List item 2
<MENU> menu <LI type="circle">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 NAME="ROBOTS"
<META> meta Nothing will show
content="NOINDEX,FOLLOW">
Example 1: Example 1:

<OL> 1. List item 1


<LI>List item 1
<LI>List item 2
2. List item 2
<LI>List item 3 3. List item 3

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 5 of 9
:
<LI>List item 4 4. List item 4
ordered </OL>
<OL>
list
Example 2:
Example 2:
a. List item 1
<OL type="a">
b. List item 2
<LI>List item 1
<LI>List item 2 c. List item 3
<LI>List item 3 d. List item 4
<LI>List item 4
</OL>
<FORM METHOD=post ACTION="/cgi-
bin/example.cgi">
<CENTER>
Select an option:
<SELECT>
<OPTION>option 1 Select an option:
listbox <OPTION SELECTED>option 2
<OPTION> option 2
option <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 This is an example
paragraph tag. <P> This will create a line break displaying the use of the
and a space between lines. paragraph tag.

Attributes: This will create a line break


and a space between lines.
Example 1:<BR>
<BR> Attributes:
<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 Example 2:<BR>
of the paragraph tag.
<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>

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 6 of 9
:
of the paragraph tag. displaying the use
of the paragraph tag.
small
<SMALL> <SMALL>Example</SMALL> Example
(text)
strong
<STRONG> <STRONG>Example</STRONG> Example
emphasis
Example 1:

<TABLE BORDER="4" CELLPADDING="2"


CELLSPACING="2" WIDTH="100%">
<TR>
<TD>Column 1</TD>
<TD>Column 2</TD>
</TR>
</TABLE>
Example 1:
Example 2: (Internet Explorer)
Column 1 Column 2
<TABLE BORDER="2"
BORDERCOLOR="#336699" CELLPADDING="2"
CELLSPACING="2" WIDTH="100%">
Example 2:
<TR>
<TABLE> table <TD>Column 1</TD> Column 1 Column 2
<TD>Column 2</TD>
</TR>
</TABLE>
Example 3:
Example 3: Column 1 Column 2
Row 2 Row 2
<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> Column 1 Column 2
<TD>Column 2</TD>
</TR>
</TABLE>
<DIV align="center"><TABLE>
<TR>

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 7 of 9
:
<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 Column Column
</TR> 1 2 3
table Row 2 Row 2 Row 2
<TH> <TR>
header
<TD>Row 3</TD> Row 3 Row 3 Row 3
<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
<TITLE> <TITLE>Title of your webpage</TITLE>
title be viewable in the title bar.
<TABLE BORDER="2" CELLPADDING="2"
CELLSPACING="2" WIDTH="100%">
<TR>
Column 1 Column 2
<TR> table row <TD>Column 1</TD>
<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
<LI>List item 2 List item 1
</UL> List item 2
<BR>
unordered Example 2:<BR>
<UL> <UL type="disc">
list 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>

https://www.csun.edu/science/help/help_docs/html_tags.html 5/22/24, 4 15 PM
Page 8 of 9
:

You might also like