Professional Documents
Culture Documents
Htmlse Myanmar
Htmlse Myanmar
HTML By Saturngod
HTML
Internet Internet
Homepage
Internet
Internet
Network Information Web Page
Web Page HTML Web Page Web Browser Software
Web Broswer Software Internet Explorer Firefox
HTML History
1989 Tim Berners-Lee Rober Calliau Research Documents
Berners-Lee browser Tag
tage Hyper-Link
document tag Berners-Lee Hyber Text Markup
Language HTML
Tag
Tag Text HTML code
<b>This is bold </b> web browser bold <b> </b>
tag tag /
HTML Editor
HTML Editor IDE Dreamweaver HTML
Website Dreamweaver HTML code
website website
template HTML code Notepad
notepad++ HTML web site
web programming PHP,
ASP.NET , JSP , Ruy On Rail
http://wwww.saturngod.net
Page 2
HTML By Saturngod
HTML
. Notepad
<html>
<head>
<title>This is title</title>
</head>
<body>
This is body
</body>
</html>
http://wwww.saturngod.net
Page 3
HTML By Saturngod
. save Save Dialog box filetype All file file name
firstrun.html firstrun .html file extension
HTML page .html .htm browser
page
IE7
Page > View Source Notepad HTML
IE 6
http://wwww.saturngod.net
Page 4
HTML By Saturngod
code page save
Internet Web site view > source save
Header Tag
notepad
<html>
<head>
<title>Example Of Header</title>
</head>
<body>
<h1>This is Header</h1>
This is normal text
</body>
</html>
h6
notepad save
<html>
<head>
<title>Example</title>
</head>
<body>
<h1>H1</h1>
<h2>H2</h2>
http://wwww.saturngod.net
Page 5
HTML By Saturngod
<h3>H3</h3>
<h4>H4</h4>
<h5>H5</h5>
<h6>H6</h6>
</body>
</html>
html
page bold
italic underline
Line Break
HTML <br/> close tag <br/>
<br>
<html>
<head>
<title>Example</title>
</head>
<body>
First Line<br/>Second Line<br>Third Line
</body>
</html>
Bold,
Bold, Italic , Underline Tag
bold <b> italic <i> Underline
<u> notepad run
<html>
<body>
<b>This is bold</b> <br/>
<i>This is italic</i> <br/>
<u>This is underline</u> <br/>
</body>
</html>
http://wwww.saturngod.net
Page 6
HTML By Saturngod
<i> <b><i></b></i>
structure
code
Pre Tag
Enter
dream
weaver
HTML
<html>
<head>
<title>Example</title>
</head>
<body>
<pre>Pre Tag, Now Enter
Now Tab
Tab
</pre>
</body>
</html>
Paragraph Tag
paragraph <p>
tag
http://wwww.saturngod.net
Page 7
HTML By Saturngod
<html>
<head>
<title>Example</title>
</head>
<body>
<h1>About Notepad</h1>
<p>Notepad is a basic text editing program and it is most commonly used to view or edit
text files. A text file is a file type typically identified by the .txt file name extension.</p>
<b> How do I change the font style and size?</b>
<p>Changes to the font style and size affect all the text in the document.<br/>
Click the Format menu, and then click Font.<br/>
Make your selections in the Font, Font style, and Size boxes.<br/>
An example of how your font will look appears under Sample.<br/>
When you are finished making font selections, click OK.<br></p>
</body>
</html>
Horizonal Line
horizonal <hr> close tag
<html>
<head>
<title>Example</title>
</head>
<body>
<h1>About Notepad</h1>
<p>Notepad is a basic text editing program and it is most commonly used to view or edit
text files. A text file is a file type typically identified by the .txt file name extension. </p>
<hr>
http://wwww.saturngod.net
Page 8
HTML By Saturngod
<h1> How do I change the font style and size?</h1>
<p>Changes to the font style and size affect all the text in the document.<br/>
Click the Format menu, and then click Font.<br/>
Make your selections in the Font, Font style, and Size boxes.<br/>
An example of how your font will look appears under Sample.<br/>
When you are finished making font selections, click OK.<br></p>
</body>
</html>
Attribue
tag attribute attribute tag
properties tag attribute body color attribute
Body Color
<html>
<head>
<title>Example</title>
</head>
<body bgcolor=silver>
Body BGCOLOR
</body>
</html>
http://wwww.saturngod.net
Page 9
HTML By Saturngod
code
run
background
color
Table color 16
Silver
Gray
Maroon
Green
Navy
Purple
Olive
Teal
White
Black
Red
Lime
Blue
Magenta
Yellow
Cyan
<html>
<head>
<title>Example</title>
</head>
<body bgcolor=#e5bb2c>
Body BGCOLOR Hex code
</body>
</html>
http://wwww.saturngod.net
Page 10
HTML By Saturngod
Hr Attribute
tag attribute tag attribute
hr
<html>
<head>
<title>Example</title>
</head>
<body bgcolor=#e0e0e0>
Default HR
http://wwww.saturngod.net
Page 11
HTML By Saturngod
<hr>
Hr with size=1
<hr size=1>
Hr with size=5
<hr size=5>
Hr with size=10
<hr size=10>
Hr with size=10 and noshade
<hr size=10 noshade>
Hr with size=5 and color
<hr size=5 color=#D60000>
</body>
</html>
List
List order list unorder list list list
defination list unorder list
Unorder list
<html>
<head>
<title>Example</title>
</head>
<body>
<h3>Unorder List</h3>
<ul>
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ul>
</body>
</html>
http://wwww.saturngod.net
Page 12
HTML By Saturngod
<html>
<body>
<h3>Unorder List</h3>
<h5>Disc</h5>
<ul type="disc">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ul>
<h5>Square</h5>
<ul type="square">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ul>
<h5>Circle</h5>
<ul type="circle">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ul>
</body>
</html>
Ordered List
<html>
http://wwww.saturngod.net
Page 13
HTML By Saturngod
<head>
<title>Example</title>
</head>
<body>
<h3>Ordered List</h3>
<ol>
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
</body>
</html>
<html>
<head>
<title>Example</title>
</head>
<body>
<h3>Ordered List</h3>
<ol type="1">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
<h5>Type A</h5>
<ol type="A">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
<h5>Type a</h5>
<ol type="a">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
http://wwww.saturngod.net
Page 14
HTML By Saturngod
</ol>
<h5>Type a</h5>
<ol type="I">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
<h5>Type i</h5>
<ol type="i">
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
</body>
</html>
Definition List
<html>
<head><title>Example</title></head>
<body>
<h3>Definition List</h3>
<dl>
<dt>HTML
<dd>Language used to develop Web Pages
<dt>Image
<dd>Any graphic such as an icon,bullet, line, photo , or illustration
</dl>
</body>
</html>
http://wwww.saturngod.net
Page 15
HTML By Saturngod
HTML
http://wwww.saturngod.net
Page 16
HTML By Saturngod
Optional Tag
Move To Center
center
<html>
<head><title>Example</title></head>
<body>
<center>
This is center
</center>
</body>
</html>
This is center
<html>
<head><title>Example</title></head>
<body>
<h1 align="justify">Test</h1>
</body>
</html>
code header
Marquee
Marquee
<html>
<head><title>Example</title></head>
<body>
http://wwww.saturngod.net
Page 17
HTML By Saturngod
<marquee>Im moving</marquee>
</body>
</html>
code
Marquee attribute
Attribute Name
Properties
Descripton
behavior
alternate
<marquee behavior="alternate">I'm moving</marquee>
scroll
default value
<marquee behavior="scroll">I'm moving</marquee>
slide
<marquee behavior="slide">I'm moving</marquee>
direction
left
default value
<marquee direction="left" >I'm moving</marquee>
right
<marquee direction="right" >I'm moving</marquee>
up
<marquee direction="up" >I'm moving</marquee>
down
<marquee direction="down" >I'm moving</marquee>
loop
[number]
marquee
number
<marquee loop="1" >I'm moving</marquee>
scrollamount
[number]
pixel
<marquee scrollamount="10">I'm moving</marquee>
scrolldelay
[number]
millisecond 1000
1 second
Bgcolor
[hex code] OR
[Color Name]
background color
<marquee bgcolor="#009933" >I'm moving</marquee>
marquee
font
Font
http://wwww.saturngod.net
Page 18
HTML By Saturngod
Font HTML Web Page font font tag
<html>
<head><title>Example</title></head>
<body>
<font face="Zawgyi-one">Zawgyi Font </font>
</body>
</html>
Properties
Description
color
[hex code] OR
color
[color name]
size
[number]
-1 -6 -1 3
2
<font face="Zawgyi-one" size="5">Zawgyi Font </font>
<font face="Zawgyi-one" size="+2">Zawgyi Font </font>
<font face="Zawgyi-one" size="-2">Zawgyi Font </font>
Description
<b></b>
font blod
<big></big>
bold
<blockquote></blockquote>
tab
<i></i>
italic
<pre></pre>
<small></small>
<strike></strike>
<sub></sub>
H2
<sup></sup>
22
<tt></tt>
<u></u>
underline
http://wwww.saturngod.net
Page 19
HTML By Saturngod
<html>
<head><title>Example</title>
<body>
<!-- Link To Gallery Page -->
<a href="gallery.html">Gallery</a>
</body>
</html>
http://wwww.saturngod.net
Page 20
HTML By Saturngod
Gallery.html
<html>
<head><title>Example</title>
<body>
<!-- Link To Home Page -->
<a href="index.html">Home</a>
</body>
</html>
address
page
Name
Link
vistied click
body vlink attribute link attribute
<body
vlink="green"
link="green">
link
color
./file.html OR file.html
C:\example\index.html C:\example\gallery.html
./ directory
./download/download.html OR download/download.html
http://wwww.saturngod.net
folder
folder
Page 21
HTML By Saturngod
../file.html
folder up
C:\example\download\index.html
C:\example\gallery.html
download
folder file
../../file.html ../ folder
directory up
http://www.mysteryzillion.com
website
./download/file.zip OR download/file.zip
site site
structure Link
.. page
Image
web page page
...
<html>
<head>
<title>Example</title>
</head>
<body>
<img src="Apple-logo.jpg"> Apple Logo</body>
</html>
http://wwww.saturngod.net
Page 22
HTML By Saturngod
) image
<html>
<head>
<title>Example</title>
</head>
<body>
<img src="Apple-logo.jpg" width=80px height=80px> Apple Logo</body>
</html>
alt Mouse
tool tip alt search engine image search
search engine
Image attribute text align
text align img code align attribute
Align
top
align
bottom
default
middle
left
page
right
Left
http://wwww.saturngod.net
Page 23
HTML By Saturngod
: img top
: img bottom
: img middle
: img left
: img right
Image
http://wwww.saturngod.net
Page 24
HTML By Saturngod
click size page
click
<html>
<head>
<title>Example</title>
</head>
<body>
<a href="fullsize.jpg"> <!-- Full size when click -->
<!-- img src is small size -->
<img src="smallsize.jpg" width=80px height=80px border=0>
</a>
</body>
</html>
code border
href image border Link
: border image
: border
link page
sample
web page
table table frame
professional
stylesheet
Table
Table roll column cell
http://wwww.saturngod.net
Page 25
HTML By Saturngod
Table HTML web site
Gallery Page
Page Layout CSS Table CSS CSS
Cascading Style Sheets CSS Web Page
HTML HTML
CSS
http://wwww.saturngod.net
site
HTML
Page 26
HTML By Saturngod
<html>
<head>
<title>Example Table</title>
</head>
<body>
<table>
<tr> <!-- Row-->
<td> <!-- Column -->
Row
</td>
<td>
Row
</td>
</tr>
</table>
</body>
http://wwww.saturngod.net
Page 27
HTML By Saturngod
</html>
Table
<table> </table>
Row
<tr></tr>
row
<tr></tr><tr></tr>
column <td></td> <td></td> <tr> </tr>
column <tr><td></td><td></tr> column
... row column
row <tr> </tr> column <td></td> row
row table
<table>
<tr> <!-- First Row -->
<td> <!-- First Column -->
1
</td>
<td>
2
</td>
<td>
3
</td>
</tr>
<tr> <!-- Second Row -->
<td> <!-- Second Column -->
4
</td>
<td>
5
</td>
<td>
6
</td>
</tr>
http://wwww.saturngod.net
Page 28
HTML By Saturngod
</table>
table
<html>
<head><title>Example</title></head>
<body>
<table>
<tr><!-- First Row -->
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr><!--Second Row -->
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr><!-- Third Row -->
<td>6</td>
<td>7</td>
<td>8</td>
</tr>
</table>
</body>
</html>
...
table width table width % pixel
table width <td> width % Pixel
http://wwww.saturngod.net
Page 29
HTML By Saturngod
% broswer width pixel
% broswer pixel
browser ..
<html>
<head><title>Example</title></head>
<body>
<table width="100%">
<tr><!-- First Row -->
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr><!--Second Row -->
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr><!-- Third Row -->
<td>6</td>
<td>7</td>
<td>8</td>
</tr>
</table>
</body>
</html>
<table width="100%">
<tr><!-- First Row -->
<td width="30px">1</td>
<td>2</td>
http://wwww.saturngod.net
Page 30
HTML By Saturngod
<td>3</td>
</tr>
<table width="100%">
<tr><!-- First Row -->
<td width="45%">1</td>
<td width="20%">2</td>
<td width="35%">3</td>
</tr>
<html>
<head><title>Example</title></head>
<body>
<table width="100%">
<tr><!-- First Row -->
<td>Date</td>
<td>Time</td>
<td>Subject</td>
</tr>
<tr><!--Second Row -->
<td>Oct 07</td>
<td>1:00 PM - 3:00 PM</td>
<td>Hardware</td>
</tr>
<tr><!-- Third Row -->
<td>Oct 08</td>
<td>1:00 PM - 3:00 PM</td>
<td>Software Install</td>
</tr>
<tr><!-- Fourth Row -->
<td>Oct 08</td>
<td>1:00 PM - 3:00 PM</td>
<td>Windows Install</td>
</tr>
http://wwww.saturngod.net
Page 31
HTML By Saturngod
</table>
</body>
</html>
.. table border
border attribute
Border,
Bor
der, Cellpadding, Cellspacing
<table width="100%" border="1"> border
border
border
<table width="100%" border="1" bordercolordark="red" bordercolorlight="#FF3300">
bordercolordark bordercolorlight bordercolor
http://wwww.saturngod.net
Page 32
HTML By Saturngod
Cell Merge
Cell Merge table Cell Merge Cell
Cell Cell Merge table row <tr>
<tr> <td>
<html>
<head>
http://wwww.saturngod.net
Page 33
HTML By Saturngod
<title>Example</title>
</head>
<body>
<table border="1">
<tr>
<td>
Cell 1
</td>
<td>
Cell 2
</td>
<td>
Cell 3
</td>
</tr>
<tr>
<td colspan="2">
Cell 1
</td>
<td>
Cell 3
</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>Untitled Document</title>
</head>
<body>
http://wwww.saturngod.net
Page 34
HTML By Saturngod
<table border="1">
<tr>
<td>
Cell 1
</td>
<td>
Cell 2
</td>
<td>
Cell 3
</td>
</tr>
<tr>
<td colspan="3">
Cell 1
</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>Untitled Document</title>
</head>
<body>
<table border="1">
<tr>
<td colspan="3">
List Of Adboe Software
</td>
http://wwww.saturngod.net
Page 35
HTML By Saturngod
</tr>
<tr>
<td>
Adobe Acrobat
</td>
<td>
Adobe Dreamweaver
</td>
<td>
Adboe Flash
</td>
</tr>
<tr>
<td>
Adobe InDesign
</td>
<td>
Adobe Photoshop
</td>
<td>
Adboe Bridge
</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>Untitled Document</title>
http://wwww.saturngod.net
Page 36
HTML By Saturngod
</head>
<body>
<table border="1">
<tr>
<td rowspan="2">
Cell Left
</td>
<td>
Cell 2
</td>
</tr>
<tr>
<td>
Cell 3
</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>Example</title>
</head>
<body>
<table border="1">
<tr>
http://wwww.saturngod.net
Page 37
HTML By Saturngod
<td>
Row1 , Cell1
</td>
<td>
Row1 , Cell2
</td>
<td>
Row1 , Cell3
</td>
</tr>
<tr>
<td rowspan="2">
Left
</td>
<td>
Center
</td>
<td rowspan="2">
Right
</td>
</tr>
<tr>
<td> Cell 1</td>
</tr>
</table>
</body>
</html>
Appearnce
Table background color border
cell background
<html>
<head>
<title>Example</title>
</head>
<body>
http://wwww.saturngod.net
Page 38
HTML By Saturngod
<table border="1">
<tr>
<td bgcolor="blue">
<font color="#FFFFFF">BLUE</font>
</td>
<td bgcolor="red">
Red
</td>
<td bgcolor="#EABCDF">
Hex Color
</td>
</tr>
</table>
</body>
</html>
bg
color
CSS
<html>
<head>
<title>Example</title>
</head>
<body>
<table border="1">
<tr>
<td bgcolor="blue">
<font color="#FFFFFF">BLUE</font>
</td>
<td bgcolor="red">
Red
http://wwww.saturngod.net
CSS
Page 39
HTML By Saturngod
</td>
<td bgcolor="#EABCDF">
Hex Color
</td>
</tr>
<tr bgcolor="#FF6699">
<td>
a
</td>
<td>
b
</td>
<td>
c
</td>
</tr>
</table>
</body>
</html>
HTML
frame
Frame
Frame HTML Page
http://wwww.saturngod.net
Page 40
HTML By Saturngod
Frame
Page
Frame
AJAX Frame
menu menu
page Name .. frame
Frame1.html
<html>
<head>
<title>Untitled Document</title>
</head>
<body>
This is frame 1
</body>
</html>
Frame2.html
<html>
<head>
<title>Untitled Document</title>
</head>
This is frame 2
</html>
index.html
http://wwww.saturngod.net
Page 41
HTML By Saturngod
<html >
<head>
<title>Untitled Document</title>
</head>
<frameset cols="80,*" frameborder="no" border="0" framespacing="0">
<frame src="frame1.html" name="leftFrame" scrolling="No" noresize="noresize" id="leftFrame" />
<frame src="frame2.html" name="mainFrame" id="mainFrame" />
</frameset>
<noframes><body>
</body>
</noframes></html>
percentage
src
frame
Link
file
Name ..
http://wwww.saturngod.net
Page 42
HTML By Saturngod
Scrolling scrollbar Yes noresize frame resize
frame resize column
index.html
<html>
<head>
<title>Untitled Document</title>
</head>
<frameset cols="20%,30%,*">
<frame src="frame1.html" />
<frame src="frame2.html" />
<frame src="frame1.html" />
</frameset>
<noframes>Your Browser Dont Support
Frame</noframes></html>
<noframes>
browser frame
support frame support
browser
Message
browser support ..
code
<html>
<head>
<title>Untitled Document</title>
</head>
<frameset rows="20%,30%,*">
http://wwww.saturngod.net
Page 43
HTML By Saturngod
<frame src="frame1.html" />
<frame src="frame2.html" />
<frame src="frame1.html" />
</frameset>
<noframes>
</noframes>
</html>
frameset cols rows cols rows
frame rows column
<html>
<head>
<title>Untitled Document</title>
</head>
<frameset rows="20%,30%,*">
<frameset cols="*,50%" framespacing="0" frameborder="NO" border="0">
<frame src="frame1.html" />
<frame src="frame2.html" name="rightFrame" scrolling="NO" noresize>
</frameset>
<frame src="frame2.html" />
<frame src="frame1.html" />
</frameset>
<noframes>
</noframes>
</html>
http://wwww.saturngod.net
Page 44
HTML By Saturngod
<frameset> <frameset>
<frameset rows="20%,30%,*">
<frameset cols="*,50%" framespacing="0" frameborder="NO" border="0">
<frame src="frame1.html" />
<frame src="frame2.html" name="rightFrame" scrolling="NO" noresize>
</frameset>
<html>
<head>
<title>Untitled Document</title>
</head>
<frameset rows="20%,30%,*">
<frame src="frame1.html" />
<frameset cols="*,50%" framespacing="0" frameborder="NO" border="0">
<frame src="frame2.html" />
<frame src="frame2.html" name="rightFrame" scrolling="NO" noresize>
</frameset>
http://wwww.saturngod.net
Page 45
HTML By Saturngod
http://wwww.saturngod.net
Page 46
HTML By Saturngod
Link And Frame Frame Link
frame Web
HTML ..
Link Page
frame frame Page
frame index.html
<html>
<head>
<title>Menu</title>
</head>
<frameset cols="100,*">
<frame src="menu.html" id="menu">
http://wwww.saturngod.net
Page 47
HTML By Saturngod
<frame src="home.html" name="main">
</frameset>
<noframes></noframes>
</html>
<html>
<head>
<title>Menu</title>
</head>
<body>
<a href="home.html" target="main">Home</a><br>
<a href="download.html" target="main">Download</a><br>
<a href="link.html" target="main">Link</a><br>
</body>
</html>
http://wwww.saturngod.net
Page 48
HTML By Saturngod
link page
frame frame addressbar
target="_parent"
remove frame
header.html
<html>
<body>
Frame Example
<a href="main.html" target="_parent">Remove Frame</a>
</body>
</html>
main.html
<html>
<body>
Main Page
</body>
</html>
frame.html
<html>
<frameset rows="100,*">
<frame src="header.html"></frame>
<frame src="main.html"></frame>
</frameset>
</html>
frame.html
remove
run
frame
frame
frame
frame
page
link
target="_parent" page
frame
page frame
iframe
http://wwww.saturngod.net
Page 49
HTML By Saturngod
<html>
<head>
<title>Menu</title>
</head>
<body>
<iframe src="home.html" width="500" height="200"></iframe>
</body>
</html>
code <iframe>
web page
form
http://wwww.saturngod.net
Page 50
HTML By Saturngod
<html>
<head>
<title>
</title>
</head>
<body>
<form action="action.php" method=post name="frm">
</form>
</body>
</html>
form tag <form> </form> action form
submit page page server side
method get post
Input Tag
input tag textbox, button, checkbox, password, submit
<html>
<head>
<title>Untitled Page</title>
</head>
<body>
<form name="frm" action="action.php">
<input type=text name="txt" value="this is value" />
</form>
</body>
</html>
value
http://wwww.saturngod.net
Page 51
HTML By Saturngod
type
text
textbox
password
button
button
submit
file
reset
radio
checkbox
checkbox
example
<html>
<head>
<title>Form Sample</title>
</head>
<body>
<form name="frm" action="action.php">
Name:
<input type="text" name="txt" value="" />
Phone:
<input type="text" name="txt" value="" /><br />
Service:<br />
<input type="checkbox" name="chk" value="yearly" /> Yearly<br />
<input type="checkbox" name="chk" value="monthly" /> Monthly<br />
<input type="checkbox" name="chk" value="daily" /> Daily<br />
Pay With:<br />
<input type="radio" name="opt" value="paypal" /> Paypal<br />
<input type="radio" name="opt" value="master" /> Master<br />
<input type="radio" name="opt" value="visa" /> Visa<br />
<input type="submit" value="sumbit" />
<input type="reset" value="Clear" />
</form>
</body>
</html>
http://wwww.saturngod.net
Page 52
HTML By Saturngod
Fieldset Tag
code
<html>
<head>
<title>Form Sample</title>
</head>
<body>
<form name="frm" action="action.php">
Name:
<input type="text" name="txt" value="" />
Phone:
<input type="text" name="txt" value="" /><br />
<fieldset>
<legend>Service</legend>
<input type="checkbox" name="chk" value="yearly" /> Yearly
<input type="checkbox" name="chk" value="monthly" /> Monthly
<input type="checkbox" name="chk" value="daily" /> Daily
</fieldset>
<fieldset>
<legend>Pay method</legend>
<input type="radio" name="opt" value="paypal" /> Paypal
<input type="radio" name="opt" value="master" /> Master
<input type="radio" name="opt" value="visa" /> Visa
http://wwww.saturngod.net
Page 53
HTML By Saturngod
</fieldset>
<input type="submit" value="sumbit" />
<input type="reset" value="Clear" />
</form>
</body>
</html>
<html>
<head>
<title>Form Sample</title>
</head>
<body>
<form name="frm" action="action.php">
<select name="combo">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select>
</form>
http://wwww.saturngod.net
Page 54
HTML By Saturngod
</body>
</html>
<option selected>4</option>
Listbox select size attribute code
<html>
<head>
<title>Form Sample</title>
</head>
<body>
<form name="frm" action="action.php">
<select name="combo" size=5>
<option>1</option>
<option >2</option>
<option>3</option>
<option selected>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select>
</form>
</body>
</html>
code
http://wwww.saturngod.net
Page 55
HTML By Saturngod
<html>
<head>
<title>Form Sample</title>
</head>
<body>
<form name="frm" action="action.php">
Name:
<input type="text" name="txt" value="" />
Phone:
<input type="text" name="txt" value="" /><br />
<fieldset>
<legend>Service</legend>
<input type="checkbox" name="chk" value="yearly" /> Yearly
<input type="checkbox" name="chk" value="monthly" /> Monthly
<input type="checkbox" name="chk" value="daily" /> Daily
</fieldset>
<fieldset>
<legend>Pay method</legend>
<input type="radio" name="opt" value="paypal" /> Paypal
<input type="radio" name="opt" value="master" /> Master
<input type="radio" name="opt" value="visa" /> Visa
</fieldset>
Month :
<select name="date">
<option value="1">Jan</option>
<option value="2">Feb</option>
<option value="3">Mar</option>
<option value="4">Apr</option>
</select>
<br />
Category(press Ctrl for Multiselect):<br />
<select name="cat" multiple>
<option value="personal">Free For Personal Use</option>
<option value="free">Free For commercial</option>
<option value="commercial">commercial </option>
</select>
<input type="submit" value="sumbit" />
<input type="reset" value="Clear" />
</form>
</body>
</html>
http://wwww.saturngod.net
Page 56
HTML By Saturngod
multiple
http://wwww.saturngod.net
Page 57
HTML By Saturngod
HTML code
".. code "
CSS
HTML
Webdesigner
web
developer
http://wwww.saturngod.net