304

ð£ì‹ 5
õ¬ô õ®õ£‚è‹ - æ˜ ÜPºè‹
(Introduction To Web Design)
5.J ±¶aom (Introduction)
c.o c±c+o+± (Web Design) ±+_± Cc+±c±co (HTML-
Hyper Text Markup Language) _+ac+.+o ++_oC++co Cc=(
C±co. c+oo t++c +=.C.++. ..=a++.c ccc+_ ±.+(
+++ (Intracts) cc..+. .)++C++co Cc=(±. ..=a± cc.+
c.oa.±..+oc c.oa.±..+=±. .±ao +.(..+( c+c±
+..a++. c.oa.±.co tco ..c++o +oo+«± (nodes)
cc_oC++c_ ++a+c.c. ccCc+c +oc± C+a++.o tcc+o+
c± .=..c± C.+c± .+++a± C.++.c. c.oa.±.co
c+=± +=.C.+++c +.+++coc. .ca c) c.oao (World
Wide Web-WWW) c+=± _c=++c +.+++c...+o ++=o+±.
.ca c) c.o cc.C+ _c=++oc C++=.. _=±. .ca
c) c.o C.c±.+o± c.o (Web) ccC+ +co+±++ ..±o+..(
+++. ..=a++o (Net) ..=..+c (Connection) cc.+ +=.
C.+++«o= ...ao+c c.++.oo (Cables) =+o+c++. _c+o.
.ca c) c.oao ±c.a+ C++(..+Co (Hyper Iinks) ..=..
+o+=±. ..=a++o +=.C.+++«o= ...Ca ++co .)±+++±
C+aa± +ao+Co .c.+a c.o.a (Web) ++++a±+o+acoc.
..=a±c+ .c.+a c.o +..a++. c.oa+c+ ..=a+.+.
.a=co++o+aco+. ++a=±. ±o+c ++co+.o. C._c+o
++.(± _acC± _=±.
'±c.a _c=±' (Hypertext Document) c++++ i¯¯i. e´c iz
.o. ..=a++o .+a++ C++co..(± ±c.a _c=++c
'c.o. .o+++c' (Web Pages) cc_ ..±o+..(+c+c. c.o.
.o+++c cc..c. c.o+ C+.ca+++c (Web Servers) cc..(±
+=.C.+++oo C+±++ .co+..(± C++..+o+=±. c.o+
C+.ca+++ooc++ c.o. .o+++.o Cc=±. C._+c+
+=.C.+++c c.o a+ac+c (Web Clients) cc..(+c+c. c.o
a+ac+c. 'c.o to+c' (Web Browser) cc=± +aoc t+ca.c.
c.o. .o+++.o. .+a.ca(+c+c. c.o..o+++c. '±c.ao
305
=+a( C±+±' (Hyper Text Markup Language-HTML) cc=± C±+±.a.
.ac.(++ tcc+o+..(+c+c. ±c.a _c=++.o .)±++o
C++co. ..=a+±+c+. ±c.a. .)±+++ C++c.+ (Hyper Text
Transfer Protocol-HTTP) cc=± ++co C++.a. C++c.+.a. .ac
.(++o C++c+++. cc C+ao.+( ccc+_ +.+Cc++..(±
cc.++= c±++.(± c+c.+Ca 'C++c.+' (Protocol) cc..(
+++. .c=± +ooa±+++ C++ocC+co. C+a++oc c±c.±..
+c (Message Formats), .+C+a++.o .a=( +=.C.+++c +±o
+..Ca .)±++o C++co. cc.++ Cc=±a c+c.++c _+a
c++c c.+a+c cc).C. 'C++c.+' (Protocol) _=±.
±c.a _c=++oc c.o. .o+++c ..±c. c+c).
'ccôa+c co ..+++.±' (Uniform Resource Locator - URL) cc_ .+a.
.(+++. c.o..o+± cc.+ C.c±.+o± t.a. c.a+.o.
.oc.+±. c+ .o+++«o++c C++(..+c _+ac+.+ tco.o
+a++=±. Cc+±c±co ±+_± Cc+±±G _+ac++c +a..+(
+.o. .ca c) c.o. C.a.±.. (WWW Consortium) c.aa_o+++.
++c.o tcc+o+c±. .+.c ..=a++o .+a.ca.c±. .ac
o++ c+_o C++co.... c±c.±..++ Cc+±c±co co+=+++.
..=a++c ++c.o. .+a.ca. ±+. C.++c++. .ac.(++.
.(± to+c+c (Browsers) .±oCa+++..±c .c.aC+. co¬
.Co+aa ±+_± C+.¬C+. C+coC+..a _+a .a=(±+=±.
5.2 1oæ)ó 涱1 Omm1±m e_ùuoo
(Elements of Hyper Text Markup Language)
cc ±c.a _c=+.+. ccc+_ c±c.±+++ +.aao ++..
Cc=(± cc..+ c.o to+co= t=a++± c.(+.o (Tags)
tco.o+aC+ ±c.ao =+a( C±+±a+=±. Cc+±c±co
C±+±.a. .ac.(++ c.o..o+++c tcc+o+..(+c+c.
'C++.C.(' C.+c+ ca co.±a+c t.a+ C++=.c (Text Editor)
.oo+ cac.C.e C.+c+ cc c.o..o++ C++=.c.a. .ac
.(++ c.o..o+++.o tcc+o+ c±a±. Cc+±c±co c.(
+.o. .ac.(++ Cc+±c±co t_..+c c.aa_o+..(+c+c.
m1óoóom´1:
cc c.o..o+++c C++.o+++o± c±co± ..±C.+
Cc=±a c.(+c.
306
<html>
.............
.............
</html>
Cc+±c±co c.(+c c.C.++± C++= .....o =++«o
=c ..±o+..(+c+c. ccCc+c C++.o+ c.(± cc c±..
c...o C++=±co=±. C±++=. c(++o++.±o <html> cc.+
C++.o+ c.(. </html> cc.+ c±.. c.(. ..+ C++= .....o
=+o= .(++ cc cc++acoC++( ..±C.+ Cc=(±.
.+++(++ C++.a...a c.±c C.aa ..±C.+ Cc=(±.
c.(. C.aa+c c.++ c±c t=ac .++.c. .++c+. ++a
c.++o. C.)a c.++o. c..±a± .co+o+±. .++ aoo
++a c.+++Co .ac.(++...(coc.
C++.o+. c±.. c.(+«o+..Ca ..±C._± t.a. 't_.
cc tco.o+±' _=±. .+.c c.(+c c.+..± .+a+o
Cc=(±.
±++) Cc+±c±co t_.. cc.+o ++=+.
<body>
This is my first HTML document
</body>
Cc+±c±co t_..+c C++.o+ c.( <body> cc.+o
C++.++. c±.. c.( </body> cc.+o c±+++. c. c.o
_c=c± .ccc c.(+«o=c ..++c(+c++.
t=.±ao cc c.o _c=++o .a=( .=++c tcoc.
® +.o... .=+
® t.+.=+
+.o... .=+. <head>, </head> cc=± ca ..= +.o
c.(+o+o ...a+o± ++=..(+++. t.+.=+. <body>, </body>
cc=± ca ..= t.o c.(+o+o ...a+o± ++=..(+++.
cc Cc+±c±co C++.co c++ ..++o Cc=(±+c+o±
coo+c.a ..±C.+o+±. <!--comment> cc+ c.( -o± coo+
307
c.a.a+ C+a++o C++coo+±. to+c. coo+c.a+.o. .+o
+=++c(±. _c=+.+. .±++. .)++C++co co.±a+a
.co=± C.+c.C. coo+c.a+c C+ao+..(+c+c. <head>
c.( +..+a±++ ..±C.+ Cc=(± cc.+o.o.
5.3 oæeùuù mæJ
5.3.J oæeùu s´1 (Title Tag )
+.o... .=+ ccco Cc+±c±co c.(+.oo C++=±
co+o+±. <title> c.(. c.o _c=++o= cc C.a.a c±++.
.ac.(+++.
<html>
<head>
<title> First Web Document </title>
</head>
</html>
to+c+ ++oa++c +.o... ....ao “ First Web Document”
cc=± +.o.. ..± C.+_co.+o ôC± ++=+.

title
5.3.2 1 s´1 (meta tag)
cc c.o..o++.+. .++a +(+o ++co+.o+ C+)co+
± c.( .ac.(+++. _c+o ± c.±o =+.c...(± cca++.o
to+cao ++= c±a++. ± c.(+c c.C.++C± c.o..o+++c
+.o... .=+o=cCoCa ..±C._+c+c. c.o _c=+.+
tcc+o+a _+)a)c C.a.a .+++ C++coc±. c.o+
+o+.+ cc)o=± ++c+ C++++.o .+++ C++coc± .++
c.( .ac.(+++. _c=++o .±o+± .ac.(++.... C+++
+oc C++=+Ca ++c+ C++++c cc..(+c+c. ..c. _c=+
+c =±.o+ C+oc++ t=a++±.± .co+Cc=(±. C+(
+.o..
308
C.+++c (Search Engines) c.o+ +o++.o c.+..(++ .++ ++c+
C++++.o. .ac.(++o C++c+c+c.
m1óoóom´1:
<meta name = “Author” content = “ Albert”>
<meta name = “ Keywords” content =“books, definitions”>
<meta> c.±c name .=.o+_. .aca c.aa_o=± ±+++.o
...a+o± ++=. .ac.(+++. content .=.o+_. .++ ±+++oc
±+..+.oo =+.c.. .ac.(+++.
C.c±.+o+c to+c+oo. .aca Refresh .oo+ Reload cc
.co=± C.++++c+.oo +oo C+ac+c -o± c.o. .o++.+.
.+.c++oC++co c±a±. +o c.o _c=++oo tco.o+±
.cc.C.++ ±++oC++=C. .co=±. ccCc. ...o+++c .+a
tco.o++.+. .+a.ca. cc±cc+o ...o++.+ C±+C++cc
c.+ao (Refresh / Reload) .+.co+ Cc=(±. _c+o <meta>
c.±.c. .ac.(++o =+.c.. C+a ...Cco+oo .o+++.o
++±++Cc .+.c++oC++co+ C+aa c±a±. http-equiv cc=±
.=.o+_ .++=. .ac.(+++.
m1óoóom´1:
<meta http-equiv = “ refresh” content = ”30”>
++C.++ to+cao C+)++ C++=±co=± c.o..o+±.
¯. cc+±+«o= cc c.+ ++c++Cc .+.co+..(±. =+.c..
C+a++o=. cc CcC++c c.o. .o+++o=+ +.++c.. c±a±.
<meta> c.±co .++= c±a=(.
m1óoóom´1:
<meta http-equiv = “refresh” content = “5; url = www.yahoo.com”>
.++ <meta> c.(. ++C.++ ++.±o C++=±co=± .o++.+
· cc+±+c ++.±a c+=. a++ c.o++o++o=+ +.++c.c
c(±. content .=.o+_. .++ c.o..o+++c a_aco.o
...a+o± ++.(±. c.o. .o++.+. .+.c..++= cc.++
to+c c++.c cc+±+c ++++co+ Cc=(± cc..++ C+)co
=±. ++++co=± C+a++o=± a_acooo=± ...ao ..a.
.co ..±C._±.
309
5.3.3 mmm s´1oo (Style Tags)
+.o... .=+ao .+= (Style) c.(+.o. .ac.(++ c±
a±. c.o _c=++o cc =+.c.. c.( c+C+oo+± ..±
C.+_coC++ .+C+oo+± c.±c cccao.+c .=cao.+.o
±+++a.±o+ .+= c.( .ac.(+++. .+= c.( .a=( .=+
+.oo C++=.+. C+ac(Selector) ±+_± .=. (Property).
m1óoóom´1:
<head>
<style>
h2 (color : blue)
</sttyle>
</head>
<h2> c.(. +.o.. c..+=±. c.o..o+++=c +.o..
+«o=. .ac.(++o +±a ccc.aa_o+.... c±c.±...
.+=.ao C++=.+. C±++=. c(++o++.±o <h2> c.±c ccc
ao.+c .=cao. ±+++a.±o+...(co+. <h2> c.±c .ao
.+c .=cc.± .+c tco.o+++.c to+ca+c+ +±++ c.+
+o± +_.. ++++o± ++.(±. _c+o. ++± =+.c.(co .+=
c.±o. C+ac h2, .=. color, c.( .ac.(++. .(++C++
.+C+oo+±. <h2> ±+.. blue cco =+.c.(cCo+±. ccCc.
c.o _c=++c t.+.=+ao c+C+oo+± <h2> c.±=c
..±a± tco.o++.+ to+ca+c+ +o ++++o ++.(±. _c+o
cccao.+c ++± +_.. _=±. cc =+.c.. C+aco=. .o
.=.o+_+c .co+o+±. ..c ccCc+c_± ..a..coa+o
c)o+... Cc=(±.
<style>
h2 { color : red;
font - size : 12pt:
font - family : arial;
}
</style>
..C.+ +. <h2> c.±c c±c.±... .+ = ±+c±
±++.C.+=±.
310
5.4 ecmmæJ (Body Section)
c.o _c=++c t.+.=+.a ...a+o± ++.. <body>,
</body> cc=± ca ..= body c.(+c .ac.(++..(+c+c.
cc c.o _c=++c t.+.=+ .o Cc+±c±co c.(+.oo
C++=±co+o+±. +o c.(+c. t.a..=+.a c±c.±o+c±.
+o c.(+c ..++c. ...c.=+c. .±c++.o t.C+c+c±.
Cc_ +o. ±+C++(..+.o (Hyper Links) tcc+o+c± .ac.(++.
.(+c+c. .±o+± .ac.(++..(+c+ c.(+«± .c++c
.=.o+_+«± .+C+ coo+..(+c+c.
5.4.J body s´1
c+C+cCc =+.c...±. c.o..o+++c t.+.=+.a
...a+o± ++.. body c.(+c .ac.(+c+c. Cc+±c±co
c.(+c .oc+_o=± .=.o+_+.o c.aa_++. .++ c.(+oc
.ac.+... C±±.(++ c±a±. body c.( .+.o .=.o +_+.oo
C++=(co+. cc c.o..o+++c cc.o +++.+ ±+++a.±o+
bgcolor .=.o+_ .ac.(+++.
< body bgcolor = #FFFFFF>
</body>
.++o =+c.+ (code) c.o..o+++c cc.o +++.+
Cc=.±ao ±++_±. .+o bgcolor cc=± .=.o+_ #FFFFFF
cc=± ±+...o C++=(co+. .+. Cc=.± +++.++ =+o=±
.+c_± c==+=±. +c... .+.+. +o± _+ac++c C+ao.+
a+o RGB C+ao.+ .oCc_ ++o+o.c+.o. C.+c±a±.
.+c± c= . c+o z·· c.a. .+c_± c= .. c+o FF c.a
ao+c c= ±+..+c ++++.oo =+o+c+c. Cc=.± ++++c
_aec C+ao.+.
FF FF FF
R G B
.+C.+oo +c.. +++.+o =+o=± C+ao.+.
00 00 00
R G B
+++ C+ao.+ # 99BDFF, Ccoa+o +++.+a±. #7FFFD4,
311
+.o +o+.+a± =+o=±. t++«..a to+cao .oCc_ _aec
+++ C+ao.++.o. .)C++++. .+c++c.
+o .±....a+c ++++.oo =+o+. _aec C+ao.+o=.
.+o++ ++++c C.a.aCa ..ac.(++oC++co c±a±. c(++o
++..++o +c... +c... C+++o±. +o±. .+.+ _+a C.aa+.o
_aec ±+..+«o=. .+o++. .ac.(++o+±.
<body bgcolor = blue>
...................................
</body>
CcC++ c c.+ao± c.o..o+++c cc.o +++.+
±+++a.±o+o+±. C+ac.a t.+.=+a++c±. .+c .=c.c
background-color _+c± ..±++o C++coo+±. _aec C+ao.+.a
.oo+ ++++c C.a.a <style> c.±o =+.c. Cc=(±.
m1óoóom´1:
<html>
<head>
<style>
body
{
background - color: #99BDFF
}
</style>
</head>
<body>
............
............
</body>
</html>
C±Co =+.c...± <body> c.±.c c.o to+c ±+++
a.±++o C++c«±. c.o..o+++c cc.o +++.+ Ccoa+o
±++o ++.(±.
312
c.o..o+++c cc.o±++ cc ..+.+ (image) ..±++o
C++co. background .=.o+.+. .ac.(++oC++co Cc=(±.
<body background = tnlogo.gif>
.gif .oo+ .jpg c.+. ..++.o. C.++c++ to+c+c
c+_oC++c«±. text .=.o++.c. .ac.(++. t.+.=+ c.
.±aocco t.a..=+ac +++.+ ±+++a.±o+ c±a±.
<body text = red>
cccao.+c t.a ++± +c... _c+o C±++=. c.aa_.
cc-o± +c.. ++±++ ±+++oC++co c±a±.
5.4.2 oæeùu s´1oo (Heading tags)
t.+.=+aoco +.o.. c.(+c c.o _c=++c head
c.±oc++ Cc_....c. c.o _c=++o= cc +.o..+
+aCc=(C±co +.o.. c.(+.o. .ac.(++ Cc=(±.
CccCc_ c.++c. (Font) .=cao.+«.c <h1>, <h2>, <h3>,
<h4>, <h5>, <h6>... cc __ c.+a+c +.o.. c.(+c tcoc.
<h1> cc.+ t.aac t.+.=+ao c+o+.o+ +.o.c.co
=+o+++. +.o.. c.(+«o= c±.. c.( +..+a±+++ C+.c.
c±.. c.(o=. c+= c±c.±..+c+ cccao.+c +.oo=+
+c±cc(±.
m1óoóom´1:
<html>
<head>
<title>Heading Tags</title>
</head>
<body bgcolor=#99BDFF>
<h1>Computer</h1><p>
<h2>Computer</h2><p>
<h3>Computer</h3><p>
<h4>Computer</h4><p>
<h5>Computer</h5><p>
<h6>Computer</h6><p>
</body>
</html>
313
C±++=. c(++o ++.±o. <p> cc=± .++ c.( .ac.(++.
..(co+. ..+..++ .=+ ·.:.¯o coo+...(co+. +.o..
c.(+oc .oCc_ c.++c. .=co.+.o. .)++C++co ôC±
aco +.ao ++.+.a C++o=+.

h1 h2 h3 h4 h5 h6
<h1>c c.++c .oc ±+c± C.)a+. h6 c c.++c
.oc ±+c± ++a+. h2 .a=.+± +.o+ +.o... h3 -c++±
+.o. .cc++++. c+c±. cc c.o..o+++o +.o.c.c
.±a..(++ align .=.o+_ .ac .(+++.
<h1 align = center> Computer </h1>
+o Cc+±c±co c.(+«.c style .=.o ++.c.
.ac.(++. .++ c.(+oc cccao.+c .=cao.+.o ±+++
a.±o+ c±a±. style c.±.c. .=.o++++ .ac.(++±C.++.
c++ c.±co .+ =+.c...(++C++ .++ c.±.c ±.(C±
.++o=±.
m1óoóom´1:
<h2 style = “color : pink”> This text will be rendered in pink </h2>
..C.++. <h2> c.(+o..Ca +a...(co tco.o+++c
++± C+++o±+++ C++++±oo=±.
314
5.4.3. mm Ooò±mmmd s´1oo
c++ Cc+±c±co c..+a=± .+c C.++c+c C++.a.±..
cc±+_.
<tagname attribute = value> Element Content </tagname>
.±o+± .ac.(++..(± c.(+c +o ôC± coo+...
(coc.
móJ s´1 (Paragraph tag)
.++ c.( <p> cc .++.a c.aa_o+++. .+ cc .+a
c)ao .+a .++.a+ C++.+=+++. .+++c cccao.++
c.o..o+++c ....o+±++ ôa.±o+..(+c+c. .++.a co.
.o+±++. .±a±++. ....o+±++ .oo+ .c.o+±++ cc±cac+_
ôa.±o+ align .=.o+_ .ac.(+++.
<p align = center> Computer </p>
a¶ùu s´1 (Break Tag)
c+.. c.( <br> cc Cc+_ c).a+ C+c+. .ac.(+++.
c+.. c.(o= c±.. c.( C+.c .o.o. ccc+. .=.o
+_+«± +..a++. <br> c.( c±.. c.( .oo++ cc Cc_.±
c.( cc.+++.
o±mm. ±±óCom1. om±o s´1oo: (Bold, Underline &ItalicsTags)
+±±c c.( <b> t.a.a+ +±++ c.+++oo c±c.±o=±.
<u> c.( t.aao .±oC++( .(±. <i> c.( t.a.a ++ac
c.+++oo ±++_±. .++ c.(+«o= .c+_o=)a c±..
c.(+c +..+a± C+.c. c±.. c.( +a...co.oCaco
.+c c.oc c.o..o+++c ._+c.a C++.c±.
æm±m mm_m Jæcm´c ±om s´1oo
(Center & Horizontal Ruler tags)
t.a. .±c± ±+_± c+ tco.o+++.o .±a..(++o++..
.±a c.( <center> .ac.(+++. </center> cc=± c±.. c.±.c
c+aC++c«± c.aaco tco.o++.+ .±a..(++±. +..±..
.oca+c <hr> c.( cc +..±..o C++.±.c+ C+c=±.
315
m1óoóom´1:
<font face = “arial” size = 4pt color = #000000> 4pt font size
rendered in arial type in black color </font>
.+c Ccoa(.
4pt font size rendered in arial type in black color
cc_ ..±a±.
face .=.o +_. t.a.ao =+.c.. c.++c c.+ .oo+
c.++co =(±.++o ..±++o ++.. to+co= _.=a(±.
c.++ccc tcc .o.c+ +a±+co+ size .=.o+_ t+c+++.
color .=.o+_. t.a.a c++ ++++o ++..Cc=(± cc..++
C+)co+++.
mc s´1 (Image tag)
c.o..o+++o cc c.a+.o. ..+.++ C+c+ <img> c.(
.ac.(+++. .++ c.( src .=.o++.c +..+a± C.++co+
Cc=(±. src cc.+ source- ¿o =+o+++. t++c c.o..o+++o
++.. cc±.± ..++c a_aco.o .c.c. c+c).a src
.=.o++c ±+..++o =+.c.Cc=(±.
<img src = tnlogo.gif>
..++c c±c .o.c Cc=±ac+_ ..±o+ width ±+_±
height .=.o +_+c .ac.(+c+c.
<img src = tnlogo.gif width = 100 height = 120>
<img> c.±co. width ±+_± height .=.o +_+oc ±+..+.o
±+++a.±..+c -o± ..+.+. C.)+++Cc+. +++++Cc+ c.o.
.o+++=c ++..+ C+aa c±a±.
eæ)±æo mcmoæoò J)æmóod (Aligning Images within Text)
t.a+ C+a++.o+ C++.a++ ..+.+ ..±C.++ C+aao+±.
cccao.++. ..++c ôC± t.a+ C+a++c ..±C._±.
<img src=tnlogo.gif>Government of Tamil Nadu Emblem
cc_ ..±a± <img> c.( c.o..o++.+ .cc+_ c±c.±o=±.
316
..++o=. cc ..±C._± t.a cccao.++ .±..=+ao
..±o+..(±. t.a.a +(..=+aCo+ ..+++= C±+.=+aCo+
..±..++=o ô±o++o± Cc+±c±co =+c.+.a. .ac.(++
Ccoa... C++o=++c.
<img src = tnlogo.gif align = middle> Government of Tamil Nadu Emblem
<P>
<img src = tnlogo.gif align = top>Government of Tamil Nadu Emblem
317
<img> c.±c align .=.o+_ left cc .c.cc ..±+c+
t.ao= ....o+± ..±a±. right cc .c.cc co..o+±
..±a±. ô±o++o± =+c.+.a t++c to+cao cac_
.+c++c. cC+=± cc ..+.+ c(++o C++c«++c.
<html>
<body>
<p>
<img src =”tnlogo.gif” align =”left” width=”100"
height=”50">
The align attribute of the image is set to “left”. The image will
go to the left of this text. </p>
<br>
<p>
<img src =”tnlogo.gif” align =”right” width=”100"
height=”50">
The align attribute of the image is set to “right”. The image
will go to the right of this text.
</p>
</body>
</html>
mmo) s´1 (Anchor Tag)
CcC++a _c=++o= cc ±+C++(... (hyperlink) tcc+o+
+++a <a> c.( .ac.(+++. <a>, </a> _+a .c c.(+«o
+..Ca tco tco.o+ t_.... .aca +oo C+a++o. href
.=.o++c -o± ...a+o± ++.....(± c.o..o++.+
to+c ++o=±. href .=.o+_ ±+C++(..o=)a a_aco.o+
+.(+++. <a> c.(. .ac.a .C+ Cc+±c±co _c=++o
CcC++c .=+o= ..±+++ C+oo± .oo+ CcC++c a_aco
oo= ..±+++C+oo±. ôC±aco =+c.+ CcC++a _c=+
+o++c ±+C++(... tcc+o=+++.
<a href = “http://www.yahoo.com”> Yahoo Home Page</a>
<a> c.±o .oo=+ ++oa+.+o =+.c.(. c.o..o++.+
cc .+a ++oa++o. ++..+ C+aa c±a±. .oo=+ ++oa+.+
blank, -top, -self, -parent .c+_c cc+++o =+.c. c±a±.
cc ±+C++(.. cc.+ t.a. ..± .oo+ .a=(± C+a++
+++ .co+o+±. ôC±aco =+c.+. tnlogo.gif cc=± ..++c
±+ +oo C+aa .c++. +±±++( .a+ c.o++o++c c+...
.o+++o= ..(+ C+oo±.
318
<body>
To view Government of Tamil Nadu Home Page, click the
Government’s logo.
<p>
<a href = “http://www.tn.gov.in” > <img src=tnlogo.gif></a>
</p>
</body>
t++c to+cao C±++=. =+c.+.a cac_ .+c++c.
+.±o =+.a +±±++( .a+c c++.a ±+ ++a++±C.++.
++.±a+c+ .+C.+c+ c±c± C._±. ..C.++ +oo C+a++o
+±±++( .a+c c.o..o+± to+cao C++++±oo=±. ..+.
.)C+++o=±C.++ t++c +=.C.++ ..=a++o ..=o+.
..±co+Cc=(±.
cCa c.o _c=++c CccCc_ .=++«o=± C++(..
+.o tcc+o+c±a±. .+.c+ C+ac++= c+oo. _c=++o
++± C+ooCc=±a ..++o cc +.±.c (Pointer) .c++.co+
Cc=(±. <a> c.±c name .=.o+_ .++=. .ac.(+++. +.(
cc.+ .cc+_ ..±o+..(±.
<a name = “Department”>
.c.
<a href = “#Department”>
cc=± c.±.c. .ac.(++. ...=+o=+ C++(... tcc+o+
c±a±.
c(++o++..++. cc c.o _c=++o University cc=±
.=+aoc++ .C+ _c=++oco Department cc=± .=+o=+
C++(.. c+.(++ cc±.+¹a+c. Department cc+ +.o..o=
cc.++ <a name = “Department”> cc+ c.±.c+ C+c+c±. Univer-
sity cc+ .=+ao. <a href = “#Department”> cc=± c.±.c ..±o+
c±. # =+a.+c+. CcC++c C++.c.c+ C+±++a cao+±o.
.C+ _c=++oco Department cc=± C++(... C+(±+_
to+co= t=a++±.
mmmm se s´1 (Background Sound Tag)
ccc= co c.(. ca coo C++.c.c to+c .ao=±+_
319
C+aa±. src .=.o+.+. .ac.(++ C+.C.+oo C++.. c+
Ccco =+.c.Cc=(±. C+.C.+oo C++.c.c c++.c c.+
.ao+Cc=(± cc..+a± =+.c. c±a±. c++++= C++..
c.++c. .au, .wav, .mid _+ac.
t++c c.o _c=++o ccc= ..+.a. .=++c++=.
<bgsound src = music.au loop = “infinite”>
loop .=.o+_. C+.C.+oo C++.. c++.c c.+ .ao+.
..Cc=(± cc..+o =+o+++. infinite cc=± ±+... ..+.a+
C++.a++ .ao=±+_ to+co= t=a++±.
to+cao cc +.a...+.+ .ao+. dynsrc .=.o+_.c
<img> c.±.c. .ac.(++Cc=(±.
<img dynsrc = music.dat width = 150 height = 150>
music.dat cc.+ cc ++±..o C++.. _=±. ±.+ .ao+ac
.+o. taa++.o <img> c.±c width ±+_± height .=.o +_+c
+a±+co+c+c.
5.4.5 e±!mæe Ooò±mmmd s´1oo
m´±±doo (Lists)
Cc+±c±cooo -c_ c.+a+c ..±ao+c .ac.(++.
.(+c+c.
l c).+..(++...++ ..±ao+c <ul>.......</ul>
l c).+..(++.... ..±ao+c <ol>.......</ol>
l c.aa.+. ..±ao+c <dl> ......</dl>
o1æoùm1óoùmcmo m´±±doo (Unordered Lists)
<ul> cc=± C++.o+ c.(.c .++. ..±ao C++.+=
+++. </ul> cc=± c±.. c.(.c ..±ao c±+++. <li> cc=±
c.±.c+ C++.a++ ..±ao t_.c.c tco.Cc=(±. <li>
c.( ..±aoc ca t_... ...a+o± ++.(+++. ccCc+a
t_..o=± cc <li> c.(. +c++cCa ..±C.+Cc=(±. c±..
c.( </li> C+.c .o.o. c(++o++.(.
320
<ul>
<li> Name
<li> Phone
<li> ID
</ul>
c.o to+cao -c_ ..±ao t_..+«± .cc+_ C+)a±.
l Name
l Phone
l ID
o1æoùm1óoùm´c m´±±doo (Ordered Lists)
.+c± c+.+a ..±a.o. C.+c+C+. <ul> cc=±
c.(o=. .+o++ <ol> cc=± c.±.c. .ac.(++Cc=(±.
<ol>
<li> Primary School
<li> Elementary school
<li> High School
</ol>
.+c Ccoa( ...± ..±a±.
1. Primary School
2. Elementary School
3. High School
oæ)±æmù m´±±doo (Definition Lists)
c.aa.+. ..±ao <dl> c.(.c C++.++ </dl> c.(.c
c±+++. .+. C.+.(+Co+ (Bullets) c).+ c=+Co+ .c+.
..±a.o tcc+o=+++. c.aa.+. ..±ao <dt> cc=± c.a
a.++ +.o.. (definition term) c.±.ca± <dd> cc=± c.aa.+
c.aa.+ (definition - definition) c.±.ca± C++=(co+. c.aa.++
+.o.cc ô±++ .++.o..o=)a c.aa.+ tc+co (indented)
..±a±.
c.aa.+...±ao ..±o=± c.+.
321
<dl>
<dt> Protocol : </dt>
<dd> A system of rules and procedures governing communications be-
tween two devices.
</dd> <p>
<dt> Pretty Good Privacy: </dt>
<dd> It is a program that encrypts files </dd>
</dl>
C±++=. Cc+±c±co =+c.+.a to+ca+c+ ôC±
tcoc+_ c±c.±++o ++.(±.
Protocol:
A System of rules and procedures governing communications be-
tween two devices.
Pretty Good Privacy:
It is a program that encrypts files
±´coæm s´1 (Table Tag)
<table> cc=± c.±.c. .ac.(++. c.o _c=++o ca
...c.=.a tcc+o+o+±. ...c.=ao cc .+a +.o
.+.a+ C+c+ ...c.=o +.o.+ (Table Row) c.( <tr> .ac.(
+++. ...c.=o +.o.+ cc+=c. C+(o.+ac +.o...o
=+..++++c cc .+a +o+.++ C+c+ ...c.=+ +.o..
(Table Header) c.( <th> .ac.(+++. ...c.=o +.o.+ cc+
=c. ±+... tco(c++++c cc .+a +o+.++ C+c+. ...
c.=+ +ac (Table Data) c.( <td> .ac.(+++. ...c.=aoco
..c++o +o++.oa± +++ cc +.a.a tcc+o+ ...c.=
c.±c border .=. .ac.(+++. c. ...c.=o=± cc
+++.+a.. bgcolor .=. .ac.(+++. +++c cc±.± .oco=
.oo+ +.a C++c«±oco= ca ...c.=ao +.o.++«±
C+(o.++«± c++.c Cc=(±+c+o± .co+o+±.
cc +o±. cc_o= C±+... C+(o.++«o=. .acaco+
Cc=(C±co.
<td colspan = x> </td>
322
cc_ +...o ..±o+Cc=(±. x cc.+ c++.c C+(o.+
+«o=. .ac Cc=(± cc..+o =+o+++. .+C.+o.
<td rowspan = x> </td>
cc=± +...o. cc +o± x +.o.++«o=. .acaco++ C+aa±.
cellspacing .=.o+_. +o++«o= ...Caa+c ..Cco.a+
+a±+co+++. padding .=.o+_. +o++=c .co+Cc=±a
..Cco.a+ +o+ +ca+«o=± tco.o+++o=± ...Ca tco
..Cco +a±+co+++. .oc+c ....co+oc (pixels) c==o
.+a++ .co+ Cc=(±.
m1óoóom´1:
<table border=2 cellspacing=10 cellpadding=10>
<tr>
<td width=50 align=center>Rama</td>
<td width=50 align=center>Sita</td>
</tr>
</table>
C±++=. +...o+ C++=+ac Ccoa( .cc+_ ..±a±.
±+=ca+oc c).+c=+.oa±. C.aa+.oa± C++=.
...c.=.a cc c.o..o+++o ..±++o ++.. c.+Cc=
±a +...o+c.
<html>
<body>
<table border=2>
<tr><th>Roll No</th><th>Name</th></tr>
<tr><td>1001</td><td>Rama</td></tr>
<tr><td>1002</td><td>Sita</td></tr>
</table>
</body>
</html>
323
C±++=. c(++o++.±o. ...c.=+ +.o.. c.(+o++
<th>, </th>_+ac+.+. .ac.(++ C+(o.++ +.o..+c ..±o
+...(coc. .+c Ccoa( .cc+_ .co=±.
m±o s´1 (Form Tag)
.ac).±c++ ++c.o. C.+. .±c++c (Forms) .ac.(
+c+c. .aca+c cc c.o++o++o .+c C+a+C++co. cc
c.o+ +o++o tca.±a. cc C+aC.+c.o (product) c.oo=
c+++. +c++.a .=.c.co+. .±c++c .ac.(+c+c. C+(
C.+++oo. C+.Cc=±a ++c+ C++++.o. .ac).±c++
C._c++=. .±c++c .ac.(++..(+c+c. .±c+.+ tcc+o+
<form> c.( .ac.(+++. .±c++c. .oCc_ .±c t_..+.oo
C++=(coc. t.a.C..±+c (text boxes), Ca±Ca+ C.++++c+c
(radio buttons), +).+a... C..±+c. C.++++c+c. ô±c) ..±ao+c
C.+c+.c .c+_c +o.
.±c±. submit C.++++c cc=± cc ++.. t_.c.co
C++=(co+. .+ .aca +c± cca++.o+ C+ao.(++.
.c+.+ cc C+.ca+. .ac.+.±.± C+a.co=± .=.a+
C+a+++. .±c++c ccCc+a t_..o=± name .=.o +_-o±
cc C.a.a .oo+ c±a±. .aca+c t.a. C..±+oo ±+..
+.o tco(+c+ca. Ca±Ca+ C.++++c+c. +).+a... C..±+c.
ô±c) ..±ao+c _+ac++o C+.ca+cc+.++ C+a+C+(o
+c+ca. .aca+c tco(± .oo+ C+a+C+(o=± ±+..+c
.c+C++( C++.a...a .±c t_..+oc C.aa+Co+( C+a++.
c.o+ C+.ca+++o= .=.c.co+..(+c+c.
<form> c.(.c method, action cc=± co+a±+c .=.o+_+c
.ac.(++..(+c+c. method .=.o+_. .±c t_..+oc C.aa
+«±. ±+..+«± C+.ca+++o= ccc+_ .=....(± cc++
c±c.+.ao =+.c(+c+c. get c±c.+. .±c t_..+oc
C.aa+.oa±. ±+..+.oa± a_acooc ccC+ao+c+c. post
c±c.+ C.aa+.oa±. ±+..+.oa± ++co C.+..o++o++
.=.c.co+c+c.
324
action .=.o+_. .±c cca++.o+ C+ao+o=± C+.ca+++
oco +ao .oo+ t.a+a.o t=a+++++. C.++ a.±c
...c+ (Common Gateway Interface -CGI) +aoc C.a.a t=a+++++.
.++.+a +ao+c C.ao. e+c+ C+acCo.. cc¬G (Active Server
Pages- ASP) C.+c+ C±+±+oo c.+..(+c+c.
<form> c.±c C.++c+c C++.a.±...
<form method = get action = “Serverscript” >
.±c+C++( C++.a...a <input> c.±.c. .ac.(++ cc
.±c t_... tcc+o+ c±a±. name .=.o+_. input t_..o=
cc C.a.a .oo+++. type .=.o+_ input c.±cc±c.±...+
+a±+co+++. text, password, hidden. checkbox, submit, reset, file, image
C.+c+.c typec .=.+oo +o. type .=.o++c ±+.. text
cc .c.cc. .+ ca t.a.C..±. .o+.+ tcc+o=±. hidden
cc=± .=.. to+cao .o...++ cc .±c. .o+.+ tcc+o
=±. submit .=.. Submit cc=± cc C.++++.c tcc+o=±.
.++. C.++++.c. .aca +oo C+aa±C.++ .±c t_..+oc
C.aa+«± .c+C++( C++.a...a ±+..+«± <form> c.±c
action .=.o++o =+.c....(co C+.ca+ +aoo= .=.c
.co+..(±. value cc=± .=.o+_ input c.(o= cc ccc
ao. ±+.c.c c±+=±. .++ ±+... .±c t_...c to+cao
++....(±.
cc ±++) Cc+±c±co .±c++o++c =+c.+.ao ++=+.
<form method=post action=”server side program name”>
<input type=text name=empname value=rama>
<input type=text name=age value=23>
<input type=submit>
</form>
C±Coaco Cc+±c±co .±c± cccao. ±+..+c
C++=. .a=( t.a. .o++.oo C++=.+. .aca submit
C.++++.c ..++a+±. cccao. ±+..+c C+.ca+ +aoo=+
+a..(±. C+.ca+ +ao. C.+.... ±+..+.o+ C+ao.(++
c..+.o to+co=+ +c.c .=..±. .oo+ .±±+..+.o+
C+.ca+++oco +ac++o++o C+±o=±.
325
o´co s´1 (Frame Tag)
+..+± cc c.o..o++.+. .o .=++o++. c)o+++. cc
Cc+c .=+a± CccCc_ Cc+±c±co -o. .o+++.oa±
+c++c tcc....+.oa± C++=±co=±. +.aac cc .=+
aoco cca++.o +.oa++ .c++oC++=(. c+ .=++oo
tco cca++.o tc.±. .+ao+ c±a±. .+C.+c+ c++
C+.c..(± c.o++o++c +..+ c++.a. .ac.(++o C++co
o+±. c(++o++..++. +o+.++ +++. .+a..++=)a C++(..+.o
(links) cc +..+++o ++=co+o+±. =+.c.. C++(...+ C+a+
C+(+++± .++=)a c.o..o+ tco.o+± CcC++c +..+++o
++....(±. +..+++c t+ca.c. cCa ++oa++o .o Cc+±
c±co .o+++.oo ++..+ C+aa c±a±. ccCc+c +..+c±
cc .o++.+o ++..c±a±.
+..++.+ c.aa_o+ <frameset>....... </frameset> _+a
c.(+c .ac.(+c+c. <frameset> c.(. .c .=.±++++.oo
(modifiers) C++=(co+. ..c. +..+++c +.o.+. C+(o.++oc
.o.co =+o=± rows, cols .=.o+_+o+=±. +..+++.oo
C++=(co c.o..o+± t.+.=+.ao C++=±co+o +.++.
<body> c.(± <frameset> c.(± ..=++ ca++.
<html>
<frameset rows=”64,*”>
<frame src=”top.html” name=”banner” scrolling=”no”
noresize>
<frameset cols=”150,*”>
<frame src=”menu.html” name=”contents”>
<frame src=”home.html” name=”main”>
</frameset>
</frameset>
</html>
rows = “64, *” cc=± .=.o+_. c+o +..+± ++oa++c ·:
+.o.++.o c(++oC++c«±. .a=.+c+ +..+± ±+ ..+.+
c(++oC++c«± cc..+o =+o+++. ±+±co=± ..± c.
c.+a± +.o.++c c(++o C++c«± cc..+ +.+++ao =+
326
t=a+++++. C±Coaco c(++o++.±o ·: +.o.++oc taa±.
·: ....co (pixel) taa+.+o =+o+++. .+o. taa++.o
c.o++.( .oco± =+.c.o+±. c(++o++.(
<frameset rows = “30%, 60%”>
.+. c.o..o+++o .a=( +.o.++c .c...+ t=a++
+++. c+o +.o.+ .++c+ c+o +..+± top.html cc=±
C++.cc+o +a.....(co+.
+..+++c name .=.o++.c. .ac.(++ ccCc+c +..
+++o=± cc C.a.a+ =.. c±a±. .cc+_ C.aa=.(c+.
.c+.+. ccc+o c(+++cc++= ±+c± t+ca++ .co=±.
src .=.o+_. +..+++c ++.....Cc=±a c.o..o++.++
+.(+++. scrolling .=.o+_. +..+++c tcc....+.oo +.(.
.(++ t+c±. ...=.o+_ yes|no|auto _+a ±+..+.o c+=±.
yes cc=± ±+... +..+++o tcc....+c C++c+++c+_ C+a+
c(±. auto cc=± ±+... tcc.... C+.ca+ .o.oa+. cc
..+ to+cCa +a±+c++o C++co .=±+o+++. cccao.
±+.. auto _=±. noresize .=.o+_. +..+++c .o.c ±+++
a.±o+. .ac.a .=±+o+++. +..++.+ c.aa_++.± +.oo++
C+a+c(±.
top.html, menu.html, home.html _+a.c Cc+±c±co C++..+c
cco.
<h2>TOP </h2> <!- -top.html- ->
<h2>MENU </h2> <!- - menu.html- ->
<h2>HOME </h2> <!- -home.html- ->
cc=± +...o c)+c. +..+++.o .±....a++o C++=.
c.o..o++.+ .cc+_ ++.(±.
327
ccCc+c +..+c± C±o± t.c)c+o++. +.o.++c
C+(o.++c cc. c)o+...o+±. Cc+±c±co +..+++oc
co+a .ac.+(. _c=++.o. .cc+o ++.++oo ++.(c++=±.
..c +c++c ++oa++oo ..±ao+± .oo+ tc++oa++oo
..±ao+±. +o cca++.o c.C.++± .+a.cao .(±.±
.c++oC++=( Cc_+oc+.+ tco+ C+a+ .oo+ ±+++a
.±++o ++.. c±a±. c.o..o+ c±c.±..+oa+«o=. .cc++
'.cc+o ++.+' -o± ++++a..(+++.
5.5 æmóC)mom"ù´ "m)m´Cmd eomOomm1
oæeùmóomoæo emomóæod
.±oCa+++... .cac.C.e cc.+. .±oCa+++... c=
C.+¬ .=++o++o++c c.o. .....+o+ (web authoring) C±c
C.+cc _=±. .+. to+o ±+c± .aco++. .ac.(++..(±
c.o. .....+o+ .ac.+( _=±.
328
5.5.J om´Joo
.o+o ++.+ (PageView), c.o..o+++.o tcc+o+c±. +c++
a.±o+c± cc 'c+co' (WYSIWYG- What You See Is What You Get)
C++=++o =±.o c±+=+++. C++...+o ++.+ (Folders View),
t++c c.o++o++o tco ..c++o C++..+.oa± C++...+
+.oa± ..±ao(±. .c+.+ ±+ co+++ C±o+=.± C+aa
.o++.+ t+c±. .+o.+o ++.+ (Reports View) c.o++o++o
tco .o+++oo±. C++(..+oo± tco +o+o+.o ...a+o±
++.(±. c±+C+o++ ++.+ (Navigation View) c.o++o+.+ c++
c).+ao .+a.ca.Cc=(± cc..+. ..±ao(±. .aca
.++o+.+. .+a.ca(± c).+.a ±+++a.±o+ c±a=(.
±+C++(..o ++.+ (Hyperlinks View), c.o..o+++o ..±++co
±+C++(..+.o c.++.±o+. .ac.(+++. .=+c ++.+ (Tasks
View). t++c c.o++o++o. +.+Cc++...Cc=±a .=+.o
tcc( C+ac++= c++ c+.(+++ +c+++.
329
5.5.2 oæe o1om´± mem oæeóoom emomóæod
i. .cac.C.e C±cC.+c.o+ ++o+c±. ..±.....ao
File > New > Web... C+a+C+(o+c±. .oo+ .±....o +cc.
....ao (Standard toolbar) New C.++++=o= .(++co ++a ô±
C++o+a .±.o=+.ao +oo C+a+. Web C+a+C+(o+c±.
z. +++c tcc+o+ cc±.± c.o++o c.+.a+ C+a+
C+(o+c±. C.++c++. coa 'cc .o+++o±' (One Page Web) tc
c+o=c+ +oo+. c+= +(+o++ Cc+_. .o+++.o .+o
C+a++oC++co c±a±. http:// cc+ C++.+=± t.a.C..±ao
t++c +o++o++c ..±c.+.+ tco(++c. +++c tcc+o=±
c.o++o+.+ t++c +=.C.++ao .++ ..++o++c C+±++
.c++oC++=( cc.+a.ca.. C.++¹a+c. c.o++o+.+ c.
.±a++ c±c.±++c+=. .ca c) c.oao (WWW) to+C±
.+a.ca(± c.+ao c.o+ C+.ca+++o ++o+o+ Cc=(±.
¯. OK C.++++.co +oo C+a+. c.o++o+.+ .cac.
C.e tcc+o+ c±o=±c.a ++++c++c. Folder View +oo
C+a+. C++.o+. .o+± (default.htm) ±+_± .c C++...++c
.c...+ C++o=++c. images cc=± C++...+ao. t++c c.o+
+o++o=+ C+.ca+c c.a+.o (graphics) ±+_± co...++.o
330
(photos) C+±++ .co+Cc=(±.
Reports View - +oo C+a+. +o++o++c .+o.++oc ..±
a.o. .+a.ca(++c. t++c c.o++o+.+ c±c.±o=± C+a+
+o. .++. .o+± ±+c± .a=co+++ .co=±. .++c++
C++=C.. C++.a._++ C++(..+.oo +=.+++. +)C+aa c±a±.
Navigation View- .co +oo C+a+ c.o++o++c c±.+C+o++
tcc.a.a. (navigation layout) .+a.ca.o+±. ..C.+.+o= cCa
cc .o+±++c c+....o+± ..±ao....±co=±. +.+a. .o
+++.o+ C+ao=±C.++. t++c c.o++o. .o+++c ..c++±
ccC++ C.+ c_ ccc+ _ C++ (o+...±co+++ cc..+.
.+a.ca. ...o+± t+c±.
HyperLink View, t++c c.o..o+++oo ..±C.+_co
C++(..+.o C±o+=.± C+aa t+c+++.
C±o± .o+++.o+ C+a+++ C+±++o C++c«++c. Task
View .o .c+.+ +.+c+++++o (Completed) =+a(++c. .(++.
c±c.±o+ .co=± .o++.+o +=.+++ ++o+ Folders View-
.c. .ac.(++o C++c«++c.
.cac.C.e. +c++ca+c c+a..c. .o+++c (Page tem-
plates) .oc+.+ c±+=+++. t++c c.o++o++o .c+.++
C+a++o C++co c±a±. +++c c+C+cCc tcc+o+.c++co
+o± cc.++ ++o+. ..±. ....ao File > Open > Web... C+a+
C+(o+Cc=(±. ..±aoo =+.c.. c.oo C++...+.a+
C+a+C+(++. Open +oo C+aac±. .cac.C.e tcc+o+a c.o+
+oo C++...+o=cCoCa t++c .o+++c ..c+.+a± C+±++
.co+ c±a±. tcc+o+.... ..c++. .o+++«o=± t)a
Cc+±c±co =+c.++.o .cac.C.e ++c++Cc c.+o
C++c«±.
5.5.3 oæeùmóoóJd eæ)æ±ò Co!óod
.cac.C.eo tcc+o+..(± cc c.o..o+++o t.a.a
..±..+. cc C++oC+aoao (Word Processor) ca _c=++o
t.a.a tcc( C+ac+ C.+c++++c. cc++o± +o Cc_.+(+c
tcoc.
i. tc+coa (indented) .+++.o tcc+o+ c±a++.
331
z. c.++co+oc ..±aooc++ cc±ca c.++c.c+
C+a+C+(++oC++co c±a±. _c+o. .++ c.++c .oo++
+=.C.++ao t++c c.o..o++.+ +++c cc±cac+_
+.aa. c±a+±o C.++o+±.
t.a.a c±c.±o+. .ac.(± .oCc_ t.a+C++=...
C.++++c+c .++ .+C+ coo+...(coc. .++. C.++++c
+.o. .ac.(++ t.a.a c±c.±o=± cc.++. .cc.a.
.=+.a+ C+a+C+(++oC++co Cc=(±.
.+ cc ô±c) ..±ao. c.++co+oc
..±ao c)a±. CccCc_ c.++co+.o+
C+a+C+(++oC++co c±a±. +++c C+a+C+(++ c.++c t++c
+=.C.++ao +)a++o ++....(++++ cc..+ to+c -o±
t_+C+a+ C++c«++c.
C.)a A ¿o +oo C+a++o. c.++ccc tcc .o.c.
C.)++o=±. ++a A-¿o +oo C+a++o c.++ccc tcc
.o.c+ ++++o=±.
B- +±±c. I- ++aCc.++. U- .±oC++( c.++
C+a+C+(++ t.a..=+o= ++-.. ..C.++++c .ac
.(+++. ..C.++++.co +oo C+a++o. ca+o±+c ++++oc
C++=.. +..o=±. Define colors +oo C+a+ .c=± .o +++
+.o. C.+c±a±.
t.a..=+.a. .o+++c ..+ ca±++. co+ ca±++.
.±a..=+ao ôa.±o+ .++o +cc+c .ac.(+c+c.
c= c).+a.. ..±ao. C.+.( c).+a..
..±ao tcc+o+ .o+cc+c t+c±. t.a..=+
.a ....o+± +coc±. co..o+± +coc± +cc+c tcoc.
5.5.4 ±´coæm emomóæod
c.o..o+++oo ...c.=+c .oc.+ao .ac.(+c+c.
cc ++a ...c.=.a c.ac++ tcc+o++ ++++ c±. .±.
...o +cc.....ao tco Table C.++++.co +oo C+ac+
++c. C.++++.co +oo C+a+cc. +..++oc C±o+++ +.±o
=+.a ++a++. ...c.=ao tco +o++.o coac.(++c.
...c.= .o.c+ C+a+C+(o=±C.++. ±=(± +.±. C.++
++.co +oo C+aaCc=(±.
332
....++o ++.±aco.± ...c.=.a+ C+a+C+(+++o.
z +.o.++c z C+(o.++c C++=. ca ...c.= ôC± tco
c+_ c.o..o+++o C++++±oo=±.
±´coæmù mmuoæo mmm¶±æmóod
a ...c.=ac .=.+.o ±+++a.±o+ ..±. ....ao
Table > Properties > Table C+a+C+(o+c±.
a ...c.=o +o++oc .=.+.o ±+++a.±o+ ..±.
....ao Table > Properties > Cell C+a+C+(o+c±. .oo+ co+
+oo +co=c±. ..±ao Cell Properties C+a+C+(o+c±. .=.+.o
±+++a.±o+ Cc=±a +o++.o c+oo coac.±o C++co
Cc=(±.
a .a=( .oo+ .++= C±o± C+a+C+(o+.... +o+
+.o cc++o+ Table > Merge Cells C+a+C+(o+c±.
a .o+o++.c ±=(± +c++cCa c)o+ cc±cc+o.
+o+.++ C+a+C+(++cc. ..±. ....ao Table > Split Cell C+a+
C+(o+c±.
.cac.C.e. Cc.o.a co++o=+++. .ac±o+ c.+ao
c.o++o+.+ c±c.±o=± cc c±c.+.a c±+=+++. .+
C.+oCc. t++c c.o _c=++o cc ..+.++ C+c+. c.+
a++ c.++.±..+± co++=±. ..±. ....o +...o+c ±+_±
+cc...... C.++++c+.o. .ac.(++Ca +..+++.oa±.
.±c++.oa± c.o..o+++o C+a++oC++co c±a±. Cc+±
c±co =+c.+ c+c± c.+Cc=±a+o.o. .cac.C.e -o±
t++c c.o++o+.+ c±c.±..++=+ C+ac.+. .a++ .c+
++o ±.(C± C.++±. +ao+o+. .o.± C+.cao.o.
333
m±mJ mmmóoo
I. uoo±´c @cmoæo m)ùuo
i . HTTP cc=± C.aa++co+± _________ cc..+o=+o+++.
HTML cc=± C.aa++co+± _________ cc..+o =+o+++.
z . cc c.o _c=± _________ cc=± c.±co C++.++.
_________ cc=± c.±co c±a±.
¯. cc c.o _c=++c .c .=++c_________.=+a±.
_________ .=+a± _=±.
: . ±c.(+c c.C.++± c.o..o+++c _________ .=+o
=cCoCa ..±C._+c+c.
·. c.o _c=++c cc.o +++.+ ±+++a.±o+ <body>
c.±co _________ cc=± .=.o ++.c. .ac.(++
Cc=(±.
·. c.o..o+++o cc.o. ..o++.+.a ..±o+ <body>
c.±c _________.=.o+_ .ac.(+++. c.o..o+++c
t.+.=+ao tco t.a c.c+c +++.+ ±+++a.±o+
_________ cc=± .=.o+_ .ac.(+++.
¯ . CccCc_ c.++c. .=cao.+«.c C±+++± _________
+.o.. c.(+c tcoc.
-. Cc+±c±co ...c.=+c +ac+.o _________ + oo
c.++.±o+c+c.
¯ . ...c.=+ +aco <td> +o++c cccao.++ _________
ôa.±o+..(+c+c. ...c.=+ +.o..o <th> +o++c
cccao.++ _________ ôa.±o+..(+c+c.
i .. _________ o <style> c.( .ac.(++c+o. c.o
_c=++o c+C+oo+± .++ c.( ..±C._++C++
.+C+oo+± .++ c.±c cccao.+c .=cao.+c
±+++..(±.
i i . style cc..+ ca c.±c .=.o++++ .++c+ _________
.ac.(++c+o. .++ c.±c .=cao.+.o ±.(C± .++o=±.
i z. _________. _________. _________ C.+c+ +o c.(+«o=
c±c c.(+c +..a++.
334
i ¯. cc ..++c .o.c ±+++.a±o+ _________ ±+_±
_________ _+a .=.o+_+.o <img> c.(.c .ac
.(++Cc=(±.
i :. _________ cc=± .oo= (target), c.o. .o++.+ cc
.+a Cc+_ to+c+ ++oa++o ++.(±. _________ cc=±
.oo=. c.o..o++.+ .C+ ++oa++=c ++o=±.
i ·. cc c.o _c=++o <frameset> c.( .ac.(++....+o
_________ c.±.c. .ac.(++ c±a++.
i ·. ..=a+c c±.. c.(+c .oo++ c.(+c _________
c.(+c cc_ ..±o+..(+c+c.
i ¯. c.o..o+++oo ++co+.o c.++.±o+ -c_ c.+
a+c ..±ao+c .ac.(++..(+c+c. ..c._________.
_________. _________
i -. c.o _c=++oo C++(..+.o tcc+o+ _________
c.( .ac.(+++. C++(..+c. _________cc_± ..±o
+..(+c+c.
i ¯. c.o to+c+c c+_oC++c++ C+oc+o=. C.++..c±c
.±..+o+cc. _________ ±+_± _________
z.. _________++.+. _________ ++.+. _________ ++.+
_+a.c cc c.o. .o++.+. .+a.ca. .cac.C.e
c±+=± -c_ c.+a+c ++.++o+=±.
II o1 ±deo oo_ mmó æ¶ùm1o
i . c.o. .o+++.o tcc+o+. .ac.(± .±....a+c
C±+± '.c..aC.o¬. ±+ao .. o++=Cce' _=±.
z . cCa c.o _c=++o <body> c.( ±+_± <frameset>
c.( _+a .a=..a± .ac.(++ c±a±.
¯. <img> c.±.c. .ac.(++ c.o _c=++o cc.o.
..+.+ ..±o+ c±a±.
: . ccCc+c c.o _c=++o± <head> c.( +..+a±++
..±C.+Cc=(±.
·. +.o... .=+ao ±.(C± <style> c.( .ac.(++..(+++.
335
·. c.o+ C+.ca+++«± a+ac+«± +±o=cCo ++co
.)±+++± C+a+C++co www cc=± C++c.+.a. .ac
.(+++c+c.
¯ . Cc+±c±co c.(+.o+ ++++a= c.+ .....o =+
+«o=c ..±o+o+±.
-. Cc+±c±cooo ..c++ c.(+«o=± .=.o+_+c
tcoc.
¯ . Cc+±c±co ...c.=+oo ...c.=+ +.o..+c
+..+a±o.o.
i .. c.o. .o+++.o c.+..(++ C+( C.+++c .ac.(++o
C++c«± c+c.±a+c Cc+±c±co t_.. <meta> c..+=±.
III. mæcomo
i . Cc+±c±co c.(+«o= c.+o+ca .+=+.o (global
styles) c.aa_..+ ccc+_¯
z . i . cc+ ±+«o= cc c.+ cc c.o..o++.++
++c++Cc .+.co++ C+ac+ ccc+_¯ .cc+_ .+.co+
Cc=±a C+.c ccc¯
¯. <meta> c.(.c C++.a...a .=.o+_+.o cc)o+.
.c++c .ac+.o coo=+.
: . cc ..+.+ ±+C++(..++ ..±..+ c..±¯
·. <style> c.±.ca±. Cc_ c.(+«.c .ac.(++..(±
style .=.o++.ca± Cc_.(++o ++.(+
·. <font> c.(.c .ac.(++..(± .=.o+_+c c.c¯
¯ . t.aa.c ..++.o+ ôa.±..+ ccc+_¯
-. cc c.o _c=++o=. ccc= ..+.a .ao=c+
c..±¯
¯ . c.o to+cao cc +.a...+.+ c.±o++.(c+
ccc+_¯
i .. Cc+±c±co c±+=± .oCc_ c.+a+c ..±ao+c
c.c¯
336
i i . ¯ +.o.++c. ¯ C+(o.++c C++=. ...c.=.a
tcc+o+ Cc+±c±co =+c.+ c.++. ...c.=o=o
+.a .co+Cc=(±. ccCc+c +o++o± cc ..± .co+
Cc=(±.
i z. +..+++c .ac.(++ t++«oC+c cc c.o++o±
tcc+o+c±. C++++ cca++c .o+±. +oc+ +=+.
cca++c .o+±. C.+.+C.+o=+c .o+±. +++.c+c .o+±
_+a .o+++.o tcc+o+ t)a ±+C++(..+.o
..±o+c±.
i ¯. <frame> c.(.c C+a++. .ac.(++..(± .=.o+_+.o
coo=+¯
i :. .cac.C.e C++=.c.a. .ac.(++ cc c.o++o+.+
tcc+o=c+ ccc+_¯
i ·. .cac.C.e C++=.c.a. .ac.(++. t.a. ..±. ...
c.= _+ac+.++ C+a++oC++cc+ c..±¯

Sign up to vote on this title
UsefulNot useful