Scribd
Upload
62 views19 pages

Example: Tag Name Code Example Browser View

The document provides examples of HTML tags and their usage. It lists common tags like <a>, <b>, <body>, <font>, <form>, <h1-6>, <html>, <i>, <img>, and <input> and provides a brief code example and description for each. The examples show how to format text, add links, structure pages, and include images and forms.

Uploaded by

rajeev_anand9
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
62 views19 pages

Example: Tag Name Code Example Browser View

The document provides examples of HTML tags and their usage. It lists common tags like <a>, <b>, <body>, <font>, <form>, <h1-6>, <html>, <i>, <img>, and <input> and provides a brief code example and description for each. The examples show how to format text, add links, structure pages, and include images and forms.

Uploaded by

rajeev_anand9
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 19

To use any of the following HTML tags, simply select the HTML code you'd like and

copy and paste it into your web page.

Browser
Tag Name Code Example
View
<!--This can be viewed in
comm Nothing will
<!-- the HTML part of a
ent show (Tip)
document-->
<a
ancho href="http://www.domain.co Visit Our
<a -
r m/"> Site (Tip)
Visit Our Site</a>
<b> bold <b>Example</b> Example

<big>
big
<big>Example</big> Example (
(text) Tip)
body
of Contents of
<body <body>The content of
HTML your web
> your HTML page</body>
docum page (Tip)
ent
The contents
of your web
The contents of your
line page
<br> page<br>The contents of
break The contents
your page
of your web
page

<cente <center>This will center your This will


center
r> contents</center> center your
contents
<dd> definit <dl> Definition
ion <dt>Definition Term</dt> Term
descri <dd>Definition of the Definiti
ption term</dd> on of
<dt>Definition Term</dt> the
<dd>Definition of the term
Definition
Term
term</dd> Definiti
</dl> on of
the
term
Definition
<dl> Term
<dt>Definition Term</dt> Definitio
<dd>Definition of the n of the
definit term</dd> term
<dl>
ion list <dt>Definition Term</dt> Definition
<dd>Definition of the Term
term</dd> Definitio
</dl> n of the
term
Definition
<dl> Term
<dt>Definition Term</dt> Definitio
<dd>Definition of the n of the
definit
term</dd> term
<dt> ion
<dt>Definition Term</dt> Definition
term
<dd>Definition of the Term
term</dd> Definitio
</dl> n of the
term
This is
This is an Example of
empha
<em> an <em>Example</em> of using
sis
using the emphasis tag the emphasis
tag
<embed src="yourfile.mid"
<embe embed
width="100%" height="60"
d> object (Tip)
align="center">
<embe embed <embed src="yourfile.mid"
d> object autostart="true"
hidden="false" loop="false"> Music will
<noembed><bgsound begin playing
when your
page is loaded
and will only
play one time.
A control
src="yourfile.mid"
panel will be
loop="1"></noembed>
displayed to
enable your
visitors to
stop the
music.
<font face="Times New
<font> font Example (Tip)
Roman">Example</font>
<font face="Times New
<font> font Roman" Example (Tip)
size="4">Example</font>
<font face="Times New
<font> font
Roman" size="+3" Example 
color="#ff0000">Example</f (Tip)
ont>
<form action="mailto:you@y
ourdomain.com">
Name: 
Name: <input name="Name"
value="" size="10"><br>   (Tip) 
<form
form Email: <input name="Email" Email: 
>
value="" size="10"><br>
<center><input Submit
type="submit"></center>
</form>
<h1> headin <h1>Heading 1
<h2> g1 Example</h1>
<h3> headin <h2>Heading 2
<h4> g2 Example</h2>
<h5> headin <h3>Heading 3
<h6> g3 Example</h3>
headin <h4>Heading 4
g4 Example</h4>
headin <h5>Heading 5
g5 Example</h5>
headin <h6>Heading 6
g6 Example</h6>
headin
g of <head>Contains elements
<head Nothing will
HTML describing the
> show
docum document</head>
ent

Contents of
your web
horizo
page (Tip)
<hr> ntal <hr />
rule
Contents of
your web
page
Contents of
your web
horizo page
<hr> ntal <hr width="50%" size="3" />
rule Contents of
your web
page
Contents of
your web
horizo page
<hr width="50%" size="3"
<hr> ntal
noshade />
rule Contents of
your web
page
Contents of
<hr> your web
(Intern horizo page
<hr width="75%"
et  ntal
color="#ff0000" size="4" />
Explore rule Contents of
r) your web
page
<hr> horizo <hr width="25%" Contents of
your web
(Intern page
et  ntal
color="#6699ff" size="6" />
Explore rule Contents of
r) your web
page
hypert <html>
ext <head>
marku <meta>
p <title>Title of your web
Contents of
<html langua page</title>
your web
> ge </head>
page
<body>HTML web
page contents
</body>
</html>
<i> italic <i>Example</i> Example
<img src="Earth.gif"
width="41" height="41"
<img> image
border="0" alt="text  (Tip)
describing the image" />
Example 1:

<form method=post
action="/cgi- Example
<input input bin/example.cgi"> 1: (Tip)
> field <input type="text" size="10"
maxlength="30">  
Submit

<input type="Submit"
value="Submit">
</form>
<input input Example 2: Example
> field 2: (Tip)
(Intern <form method=post
et action="/cgi- Submit
Explore bin/example.cgi">  
r) <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">
<table border="0"
cellspacing="0"
Example
cellpadding="2"><tr><td
<input input 3: (Tip)
bgcolor="#8463ff"><input
> field
type="text" size="10"
maxlength="30"></td><td
bgcolor="#8463ff"
valign="Middle"> <input
type="image" name="submit"
src="yourimage.gif"></td></
tr> </table>
</form>
<input input Example 4: Example
> field 4: (Tip)
<form method=post
action="/cgi-
bin/example.cgi">
Enter Your Comments:<br>
<textarea wrap="virtual" Submit Clear
name="Comments" rows=3  
cols=20
maxlength=100></textarea>
<br>
<input type="Submit"
value="Submit">
<input type="Reset"
value="Clear">
</form>
Example 5:

<form method=post
action="/cgi-
bin/example.cgi">
<center>
Example
Select an option:
5: Tip)
<select>
<option >option 1</option>
<input input Select an
<option selected>option
> field option: 
2</option>
<option>option 3</option>  
<option>option 4</option>
<option>option 5</option> Submit

<option>option 6</option>
</select><br>
<input type="Submit"
value="Submit"></center>
</form>
<input input Example 6: Example
> field 6: (Tip)
<form method=post
action="/cgi- Select an
bin/example.cgi"> option:
Select an option:<br>  Option 1
<input type="radio"
name="option"> Option 1  Option 2
<input type="radio"  Option 3
name="option" checked>
Option 2 Select an
<input type="radio" option:
name="option"> Option 3  Selection
<br> 1
<br>
 Selection
Select an option:<br>
2
<input type="checkbox"
name="selection"> Selection 1  Selection
<input type="checkbox" 3
name="selection"
checked> Selection 2
<input type="checkbox"
name="selection">Selection 3 Submit

<input type="Submit"
value="Submit">
</form>
Example
1: (Tip)
Example 1:  List
item 1
<menu>
<li type="disc">List item o List
1</li> item 2
<li type="circle">List item
2</li>  List
<li type="square">List item item 3
3</li>
list
<li> </MENU>
item
Example 2:
Example 2:
i. List
<ol type="i"> item 1
<li>List item 1</li> ii. List
<li>List item 2</li> item 2
<li>List item 3</li> iii. List
<li>List item 4</li> item 3
</ol>
iv. List
item 4
<head>
<link rel="stylesheet"
<link> link type="text/css"
href="style.css" />
</head>
<marq scrolli <marquee bgcolor="#cccccc"
uee> ng loop="-1" scrollamount="2"
(Intern text width="100%">Example
et  Marquee</marquee>
(Ti
Explore
p)
r)
<menu>  List item
<li type="disc">List item 1
1</li>
<menu <li type="circle">List item o List item
menu
> 2</li> 2
<li type="square">List item
3</li>  List item
</menu> 3
<meta name="Description"
content="Description of your
<meta site"> Nothing will
meta
> <meta name="keywords" show (Tip)
content="keywords describing
your site">
<meta HTTP-
<meta EQUIV="Refresh" Nothing will
meta
> CONTENT="4;URL=http://ww show (Tip)
w.yourdomain.com/">
<meta <meta http-equiv="Pragma" Nothing will
meta
> content="no-cache"> show (Tip)
<meta <meta name="rating" Nothing will
meta
> content="General"> show (Tip)
<meta <meta name="robots" Nothing will
meta
> content="all"> show (Tip)
<meta <meta name="robots" Nothing will
meta
> content="noindex,follow"> show (Tip)
<ol> ordere Numbered Numbered
d list 1. List item
<ol> 1
<li>List item 1</li> 2. List item
<li>List item 2</li> 2
<li>List item 3</li> 3. List item
<li>List item 4</li> 3
</ol> 4. List item
Numbered Special Start 4

<ol start="5"> Numbered


<li>List item 1</li> Special Start
<li>List item 2</li>
<li>List item 3</li> 5. List item
<li>List item 4</li> 1
</ol> 6. List item
2
Lowercase Letters 7. List item
3
<ol type="a"> 8. List item
<li>List item 1</li> 4
<li>List item 2</li>
<li>List item 3</li> Lowercase
<li>List item 4</li> Letters
</ol>
a. List item
Capital Letters 1
b. List item
<ol type="A"> 2
<li>List item 1</li> c. List item
<li>List item 2</li> 3
<li>List item 3</li> d. List item
<li>List item 4</li> 4
</ol>
Capital
Capital Letters Special Start Letters

<ol type="A" start="3"> A. List item


<li>List item 1</li> 1
<li>List item 2</li> B. List item
<li>List item 3</li> 2
<li>List item 4</li> C. List item
</ol> 3
D. List item
Lowercase Roman 4
Numerals
Capital
<ol type="i"> Letters
<li>List item 1</li> Special Start
<li>List item 2</li>
<li>List item 3</li> C. List item
<li>List item 4</li> 1
</ol> D. List item
2
Capital Roman Numerals E. List item
3
<ol type="I"> F. List item
<li>List item 1</li> 4
<li>List item 2</li>
<li>List item 3</li> Lowercase
<li>List item 4</li> Roman
</ol> Numerals

Capital Roman Numerals i. List item


Special Start 1
ii. List item
<ol type="I" start="7"> 2
<li>List item 1</li> iii. List item
<li>List item 2</li> 3
<li>List item 3</li> iv. List item
<li>List item 4</li> 4
</ol>
Capital
Roman
Numerals

I. List item
1
II. List item
2
III. List item
3
IV. List item
4

Capital
Roman
Numerals
Special Start

VII. List item


1
VIII. List item
2
IX. List item
3

X. List item
4
<form method=post
action="/cgi-
bin/example.cgi">
<center>
Select an option:
<select>
<option>option 1</option>
Select an
<optio listbox <option selected>option
option: (Tip)
n> option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
<option>option 6</option>
</select><br>
</center>
</form>
<p> paragr This is an example displaying This is an
aph the use of the paragraph tag. example
<p> This will create a line displaying the
break and a space between use of the
lines. paragraph
tag.
Attributes:
This will
Example 1:<br> create a line
<br> break and a
<p align="left"> space
This is an example<br> between
lines. 

Attributes:

Example 1: 

This is an
example
displaying the use<br> displaying the
of the paragraph tag.<br> use
<br> of the
Example 2:<br> paragraph
<br> tag.
<p align="right">
This is an example<br> Example 2:
displaying the use<br>
of the paragraph tag.<br> This is an
<br> example
Example 3:<br> displaying the
<br> use
<p align="center"> of the
This is an example<br> paragraph
displaying the use<br> tag.
of the paragraph tag.
Example 3: 

This is an
example
displaying the
use
of the
paragraph
tag.
<small small
<small>Example</small> Example (Tip)
> (text)
<strike delete
<strike>Example</strike> Example
> d text
<stron strong <strong>Example</strong Example
empha
g> >
sis
Example 1:

<table border="4"
cellpadding="2"
cellspacing="2"
width="100%">
<tr>
<td>Column 1</td>
<td>Column 2</td>
</tr> Example
</table> 1: (Tip)
Colum Colum
Example 2: (Internet Explorer) n 1 n2

<table border="2"
bordercolor="#336699"
Example
cellpadding="2"
2: (Tip)
cellspacing="2"
<table width="100%">
table Colum Colum
> <tr>
n1 n2
<td>Column 1</td>
<td>Column 2</td>
</tr>
</table> Example
3: (Tip)
Example 3:
Colum Colum
<table cellpadding="2" n1 n2
cellspacing="2" Row 2 Row 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%">
table
<td> <tr> Colu Colu
data
<td>Column 1</td> mn 1 mn 2
<td>Column 2</td>
</tr>
</table>
<div align="center">
<table>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
<tr> Colu Colu Colu
<td>Row 2</td> mn 1 mn 2 mn 3
<td>Row 2</td> Row Row Row
table <td>Row 2</td> 2 2 2
<th> heade </tr>
<tr> Row Row Row
r
<td>Row 3</td> 3 3 3
<td>Row 3</td> Row Row Row
<td>Row 3</td> 4 4 4
</tr>
<tr>
<td>Row 4</td>
<td>Row 4</td>
<td>Row 4</td>
</tr>
</table>
</div>
<title> docum <title>Title of your HTML Title of your
ent page</title> web page will
title be viewable in
the title
bar. (Tip)
<table border="2"
cellpadding="2"
cellspacing="2"
width="100%">
table Colu Colu
<tr> <tr>
row mn 1 mn 2
<td>Column 1</td>
<td>Column 2</td>
</tr>
</table>
telety
<tt> <tt>Example</tt> Example
pe
underl
<u> <u>Example</u> Example
ine
Example 1:

 List item
1
Example 1:<br>
 List item
<br>
2
<ul>
<li>List item 1</li>
<li>List item 2</li>
Example 2:
</ul>
<br> List item
unord 
Example 2:<br> 1
<ul> ered
<ul type="disc"> List item
list 
<li>List item 1</li> 2
<li>List item 2</li> o List
<ul type="circle"> ite
<li>List item 3</li> m
<li>List item 4</li> 3
</ul>
</ul> o List
ite
m
4
MouseOver PopUps provided by:

Would you like to learn how to design your


own web site?

Whether you are a complete beginner or


have some web site design experience,
this web design course will teach you how
to plan, design, build and market your own web site 

If you like these codes, you'll love Web Design


Mastery. Get these codes and many more.

"I have learned more from this web design


course than I did from a course I took in
college!" - Joseph Seeles

  More

Web Design Information:


 Web Development
 HTML Codes
 HTML Tips
 Web Design Tips
 Javascript Snippets
 216 Safe Colors
 Symbols

Web Design Articles:


 Selecting a Quality Domain Name
 Selecting the Best Web Design Language for Your Project
 Bring Your Web Site to Life With PHP
 The Birth of a Professional Web Site (10 part series)
 Increase Your Traffic by Recovering Your Lost Visitors
 Using HTML Tables to Format Your Web Page
 HTML Forms -- Back to the Basics and Beyond Part One - Basic
Forms Tutorial
 HTML Forms -- Back to the Basics and Beyond Part Two -
Advanced Forms
 HTML Forms -- Back to the Basics and Beyond Part Three -
Form Tips & Tricks
 35 Deadly Web Site Sins that will Kill Your Business!
 Selecting A Quality Web Host
 Mini-Sites -- Highly Targeted Sales Generators
 Spice Up Your Web Site with JavaScript
 Use CGI to Automate Your Web Site
 Give Your Graphics A Professional Look without the Price
 Use JavaScript to Dynamically Update Your Website
 10 Website Essentials to Increase Your Sales
 Is Your Domain Name A Trademark Infringement?
 Steps to Optimizing Your HTML Codes
 The Secrets to Building a Successful Website

Web Development Tutorials:


 Creating an Ebook
 Internet Marketing Strategies
 Internet Marketing Tools
 Developing an Internet Business
 Developing a Professional Web Site
 Free Content
 Webpage Optimization
 Hosting Your Site
 Promotion
 Internet Marketing
 Web Site Building
 Listing Your Site
 Internet Advertising
 Developing Traffic
 Web Development Strategies

You might also like