You are on page 1of 66

Phn I.

K nng c bn
1.1 HTML l g?
HTML (Hyper Text Markup Language - Ngn ng nh du siu vn !n" #$ %&t
s' (nh d)ng * + ,h+ tr-nh duy.t /e (/e r+0ser" i1t ,,h * hi*n th(
%&t trang /e2
3, trang /e th', ra khng ,4 g- kh, ng+$i vn !n ,5ng v6i ,, th7 (tag"
HTML 89, s:p x1p ;ng ,,h h+<, ,, +)n %= * tr-nh duy.t /e i1t ,,h
* thng d(,h v$ hi*n th( ,h;ng #n trn %$n h-nh2
1.2 Cu trc c! "#t $%l& HTML
1.2.1. Th (tag) HTML l g.
>hi tr-nh duy.t /e ?, %&t @i#e HTMLA n4 sB t-% tr+ng @i#e 4 ,, tag hay nhng
+)n %= <, i.t * i1t ,,h hi*n th( @i#e HTML 42
CD dEF >hi tr+ng @i#e HTML ,4 +)n
GhHI 3u tr;, ,Ja @i#e HTML GKhHI
th- sB hi*n th( +)n L3u tr;, ,Ja @i#e HTMLL #n trn %$n h-nh v6i %M, & tiu
N thM, H (sB n4i kO P phQn sau"2
3, tag HTML + ,h+ tr-nh duy.t i1t ,,h khi n$+ th- in R% %&t dSng vn
!nA in nghingA i1n dSng vn !n th$nh %&t siu #in k1t t6i ,, trang /e
kh,A hi*n th( !nh222
Tr+ng vD dE trn ta thy sau tag GhHI v$ +)n vn !n #$ tag GKhHI2 Tr+ng tag
GKhHI ta thy ,4 du K A du K nT% tr+ng U tag + hi.u ,h+ tr-nh duy.t i1t #$
hi.u Mng ,Ja tag 4 = k1t th;,2
'h( )*+ )%,c -. /0ng "#t t!g HTML nh( -!u1
Gtn tagI v5ng vn !n ,h(u t, &ng GKtn tagI2
Ch F Tr-nh duy.t khng Vuan tW% tn tag #$ ,h h+a hay ,h th8Xng nn vi.,
vi1t GhHI v$ GHHI #$ nh8 nhau2
1.2.2. Cu trc ca mt file HTML.
Yi#e HTML a+ giX ,Zng :t Qu Tng th7 Ght%#I v$ k1t th;, Tng th7 GKht%#I2
3<p th7 n$y + ,h+ tr-nh duy.t /e i1t rTng n4 ang ?, %&t @i#e ,4 ,hMa ,,
%= HTMLA ,Sn th7 GKht%#I ,4 t, dEng nh8 k1t th;, @i#e HTML2
[n tr+ng ,<p th7 Ght%#I 222 GKht%#I #$ ,, ,<p th7 GheadI 222 GKheadI v$
G+dyI 222 GK+dyI #$ phQn thWnA t)i Wy )n ,4 th* nhRp v$+ ,, +)n vn !n
,5ng ,, th7 kh, Vuy (nh vN (nh d)ng ,Ja trang2
Ng+$i ra * ghi ,h; thD,hA ti.n ,h+ vi., xe% tag HTML h+<, ,Rp nhRt %&t trang
/eA ta ,Qn <t ,h; thD,h v$+ gia G\-- v$ --I2
T2" l3% cu trc c bn c! "#t $%l& HTML l
Ght%#I
GheadI
Gtit#eI Tn trang GKtit#eI
GKheadI
G+dyI
22222
G\-- Cn !n v$ ,, th7 HTML --I
22222
GK+dyI
GKht%#I2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
2. T34 $%l& HTML 5u t%6n.
_au khi = ?, phQn trnA )n = i1t th1 n$+ #$ th7 HTML v$ ,u tr;, ,hung ,Ja
%&t @i#e HTML2 _au Wy ,h;ng ta sB ,5ng t)+ ra @i#e HTML Qu tin2
U2 MP N+tepad ,Ja /ind+0s hay t kb %&t tr-nh s+)n th!+ vn !n n$+ ,4 th*
t)+ ra nhng vn !n trcn (p#ain text"2 N1u )n d5ng Mi,r+s+@t /+rd th- ph!i #8u
tr P d)ng ^_3dd2
e2 [)n h=y nhRp nhng dSng vn !n sau
Ght%#I
GheadI
Gtit#eI3hWn trXi tri thM, - dnternet t+day GKtit#eI
GKheadI
G+dyI
3h$+ %fng )n = tha% gia ,huyn %E, 3hWn trXi tri thM, ,Ja t)p ,hD 3ng
ngh. Thng tin dnternet T+day2 Tr+ng phQn n$y )n sB 89, h?, nhng ki1n
thM, ,c !n vN HTMLA ,ng ,E * t)+ ra ,, trang /e2 _au khi = h?, x+ng vN
HTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn !nA h-nh !nhA
W% thanh222
GK+dyI
GKht%#I
H2 L8u @i#e v6i phQn %P r&ng #$ ht%2 CD dE [aiU2ht%2
L(u 7F [)n nn t)+ %&t Y+#der ring * ,hMa ,, tRp tin %$ )n sB t)+ ra tr+ng
sugt thXi gian h?, HTML2
h2 >hPi &ng d` h+<, Nes,ape2 3h?n Yi#e K ipen2 _j dEng h&p th+)i * %P @i#e
HTML )n vfa t)+2
k2 [)n sB nh-n thy trn tranh tiu N ,Ja tr-nh duy.t #$ dSng ,h L3hWn trXi tri
thM, - dnternet t+dayL v$ tr+ng trang d86i #$ L3h$+ %fng )n = tha% gia
,huyn %E, 3hWn trXi tri thM, ,Ja t)p ,hD 3ng ngh. Thng tin dnternet T+day2
Tr+ng phQn n$y )n sB 89, h?, nhng ki1n thM, ,c !n vN HTMLA ,ng ,E *
t)+ ra ,, trang /e2 _au khi = h?, x+ng vN HTML )n ,4 th* t)+ ra nhng
trang /e Qy n t89ng v6i vn !nA h-nh !nhA W% thanh222L %$ )n = vi1t
tr+ng phQn +dy
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
8. H%9n th: )n bn ; /3ng 5*"< ngh%6ng< g3ch ch=n...
.1.!i h"c
>hi tr-nh $y %&t trang /eA ,4 #;, ,Qn nhn %)nhA hay * t)+ s' kh, i.tA )n
,Qn ph!i hi*n th( vn !n P ,, d)ng R%A nghingA g),h ,hWn222 HTML ,4 ,,
tag (nh d)ng ki*u ,h * gi;p )n2
HTML #$t %u&
GuIlWy #$ tag g),h ,hWnGKuI lWy #$ tag g),h ,hWn
GiIlWy #$ tag nghing GKiI y l tag nghing
GttIlWy #$ tag ,h nh %yGKttI lWy #$ tag ,h nh %y
GIlWy #$ tag R% GKI '() l tag *+m
Ge%IlWy #$ tag GKe%I y l tag Strong
Gstr+ngIlWy #$ tag str+ngGKstr+ngI '() l tag ,tr-.g
GstrikeIlWy #$ tag str+ngGKstrikeI lWy #$ tag strike#ine
[)n ,4 th* k1t h9p ,, tag n$y v6i nhauA %imn #$ ,h;ng 89, #nng v$+ nhau %&t
,,h ,hDnh x,2 CD dEF
GI GiI 2222 GKiI GKI
Tag in nghing ph!i nT% tr+ng tag in R%2
Hcn na )n ,4 th* p dEng ,, tag v6i tiu N
GheI GiI 2222 GKiI GheI
.2.Th/c h.h
p dEng v$+ @i#e HTML ,Ja )n2
U2 T)+ %&t @i#e HTML %6i
e2 Th% ,, tag (nh d)ng ki*u ,h2 L;, n$y @i#e HTML ,Ja )n tr+ng phQn
+dy ,4 d)ng nh8 sau2
GhHIGIGiI3h; o khi t)+ @i#e HTMLGKiIGKIGKhHI
N1u )n d5ng ,, ,h8cng tr-nh s+)n th!+ vn !nGIGuI kh, N+te]ad ,Ja
/ind+0s GKuIGKIth- )n ph!i nh6 #8u k1t Vu! P d)ng vn !n trcn (^_3dd"
H2 L8u ,ng vi., ,Ja )n2
h2 p5ng tr-nh duy.t %P v$ s+ snh v6i vD dE %qu2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
>. ?@u "Ac t%6u 5B
0.1. !i h"c
>hi tr-nh $y %&t trang /eA i khi )n ph!i ,Qn 1n ,, tiu N the+ ,, kD,h
,rA phng ,h kh, nhau2 HTML ,4 ,, tag * th', hi.n vi., n$y2
l* t)+ %&t tiu N ,h;ng ta d5ng
GhxI Tn tiu N GhxI
Tr+ng 4 x #$ %&t sg ,4 gi tr( tf U 1n s ,ht kD,h ,r tiu N2 _au Wy #$ vD dE ,h+
,, ,r ,Ja tiu N2
Ti1u *2 c3 1 4566 H1 c3 7 668
Ti1u *2 c3 2
Ti1u *2 c3
Ti1u *2 c3 0
Ti1u *2 c3 9
Ti1u *2 c3 7.
0.2.Th/c h.h
Th6" c@c t%6u 5B )4 tr!ng C&b c! b3n.
U2 MP #)i @i#e HTML %$ )n = t)+ ra P $i h?, tr86, Tng tr-nh s+)n th!+ vn
!n %$ )n = d5ng * t)+ ra n42
e2 Th% +)n sau v$+ @i#e HTML2 [)n ,Qn #8u o +)n th% v$+ ph!i nT% gia
G+dyI v$ GK+dyI
GhUIu6i thi.u ,hungGKhUI
v$+ tr86, +)n L3h$+ %fng )n = tha% gia ,huyn %E, 3hWn trXi tri thM, ,Ja
t)p ,hD 3ng ngh. Thng tin dnternet T+day2 Tr+ng phQn n$y )n sB 89, h?,
nhng ki1n thM, ,c !n vN HTMLA ,ng ,E * t)+ ra ,, trang /e2 _au khi =
h?, x+ng vN HTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn
!nA h-nh !nhA W% thanh222
H2 L8u ,ng vi., )n vfa #$%2
h2 p5ng tr-nh duy.t /e * %P @i#e HTML )n vfa t)+ v$ s+ snh v6i vD dE %quA
n1u )n thy kh, )n ,4 th* ph!i xe% #)i nhng g- %-nh = t)+ tr+ng @i#e HTML2
k2 3hia vn !n th$nh nhiNu +)n
Tr86, h1t )n #)i %P @i#e HTML %$ )n = t)+ tf ,, $i h?, tr86, Tng tr-nh
s+)n th!+ vn !nA thay v- * vn !n nh8 ,ZA Wy giX P ,ugi %vi dSng )n ,4
th* gw `nter v$i #QnA khi 4 +)n vn !n ,Ja )n trng ,4 v7 nh8 sau F
3h$+ %fng )n = tha% gia ,huyn %E, 3hWn trXi tri thM, ,Ja t)p ,hD 3ng
ngh. Thng tin dnternet T+day2 Tr+ng phQn n$y )n sB 89, h?, nhng ki1n
thM, ,c !n vN HTMLA ,ng ,E * t)+ ra ,, trang /e2 _au khi = h?, x+ng vN
HTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn !nA h-nh !nhA
W% thanh222
L8u ,ng vi., )n vfa #$% v$ %P n4 trn tr-nh duy.t ,Ja )n2 >hi 4 )n sB
trng thy k1t Vu! trn tr-nh duy.t nh8 sau F
[)n ,!% thy ,4 iNu g- khng ;ng ph!i khngx [Pi v- HTML y Vua du hi.u
xugng dSng khi )n gw `nter v$ y Vua ,, dSng trgng nn )n thy +)n vn
!n %$ )n vfa nhRp d5 ,4 `nter * xugng dSng nh8ng vqn #iNn v6i nhau2
l* ,hia +)n HTML d5ng tag GpI
3Zng #8u o rTng tag GhxI g:n #iNn v6i s' ,hia +)n nn )n khng ,Qn ph!i <t
GpI tr86, GhxI2
ChDn c@c /u ch%! 543n )4 $%l& HTML c! b3n.
U2 p'ng tr-nh s+)n th!+ vn !n * %P ti#e HTML %$ )n = t)+ tf tr86,2
e2 3h;ng ta th% +)n %6i v$+ vn !nA sau +)n Qu
T)p ,hD dnternet T+day #$ %&t t)p ,hD i.n tj ,huyn vN 3ng ngh. thng tin2
3h;ng ti sB gi;p ,, )n t-% hi*u v$ kh% ph nhng D zn ,Ja HTML * )n
,4 th* t' t)+ ra ,, trang /e ,h+ ring %-nh
H2 l8a ,+n try s+)n th!+ 1n ,ugi +)n QuA th% tag GpI2 L;, n$y +)n vn
!n trng gigng nh8 sau2
3h$+ %fng )n = tha% gia ,huyn %E, 3hWn trXi tri thM, ,Ja t)p ,hD 3ng
ngh. Thng tin dnternet T+day2 Tr+ng phQn n$y )n sB 89, h?, nhng ki1n
thM, ,c !n vN HTMLA ,ng ,E * t)+ ra ,, trang /e2 _au khi = h?, x+ng vN
HTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn !nA h-nh !nhA
W% thanh222
GpI
T)p ,hD dnternet T+day #$ %&t t)p ,hD i.n tj ,huyn vN 3ng ngh. thng tin2
3h;ng ti sB gi;p ,, )n t-% hi*u v$ kh% ph nhng D zn ,Ja HTML * )n
,4 th* t' t)+ ra ,, trang /e ,h+ ring %-nh
h2 L8u #)i ,ng vi., ,Ja )n2
k2 p5ng tr-nh duy.t %P #)i @i#e HTML ,Ja )n v$ s+ snh v6i vD dE %qu2
Nh8 )n thyA ,, +)n vn !n = 89, t,h nhau d+ t, dEng ,Ja tag GpI
Th6" "#t -E t!g Fh=n 543n
GhrI 3h{n %&t 8Xng th|ng v$+ trang /e ,Ja )nA tag n$y th8Xng d5ng *
,hia nhng phQn ,hDnh ,Ja trang /e2
GrI lzy vn !n xugng %&t dSng %6iA tag n$y kh, tag GpI P ,hv n4 khng
,h{n th% v$+ trang ,Ja )n %&t dSng trgng nh8 tag GpI2 [)n ,4 th* sj dEng
tag n$y khi t)+ %&t danh s,hA vi1t ,, dSng ,Ja %&t $i thc2
CD dE F N1u tr+ng @i#e HTML ,4 +)n sau gia tagG+dyI v$ GK+dyI
GhrI
3Wu #), & Tin h?, CNNUGrI
3Wu #), & Cn h+ CNNHGrI
T)p ,hD dnternet T+dayGrI
GhrI
Th- k1t Vu! nh8 sau F
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
G. Pr&$4r"!tl&/ t&Ht
9.1.!i h"c
]hQn n$y tr-nh $y vN ,,h hi*n th( ,, +)n vn tr+ng 4 ,4 ,! ,, kh+!ng
tr:ng v$ du xugng dSng2
Nh8 )n = i1t tr+ng ,, phQn tr86,A tr-nh duy.t y Vua ,, dSng tr:ngA du
hi.u xugng dSng khi ta s+)n th!+2 Tuy nhin )n vqn ,4 th* hi*n th( 89, vn
!n nh8 #;, )n nhRp v$+ Tng ,,h sj dEng tag GpreI
CD dE
GpreI
>hi )n %ugn tr-nh duy.t /e hi*n th( ;ng nh8 )n s+)n th!+A )n nh6 d5ng
tag GpreI
[)n ,4 th* xugng dSng2
[)n ,4 th* d5ng du ,,h th+!i %i2222
GKpreI
_B 89, hi*n th( nh8 sauF
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
I. Th6" "#t J%9u trnh b+ ch4 tr!ng C&b c! b3n
7.1.!i h"c
l* #$% ,h+ %&t khgi vn !n n}i hcnA vD dE %&t +)n trD,h dqnA %&t #Xi khuyn222
v$ #$% ,h+ trang /e ,Ja )n tr-nh $y 89, ~p hcnA ,h;ng ta sj dEng tag
G#+,kVu+teI
l+)n vn !n nT% tr+ng ,<p tag G#+,kVu+teI v$ GK+,kVu+teI sB 89, tr-nh
$y thEt v$+ s+ v6i phQn thWn vn !n2
CD dE * nh-n thy +)n vn !n nh8 sauF

[)n ph!i vi1t nh8 sauF
>hi ,Qn tr-nh $y %&t +)n vn !n #5i sWu v$+ n tr+ng s+ v6i t+$n & vn !n
* +)n vn !n 89, n}i Rt hcnA vD dE )n ,Qn hi*n th( %&t ,h; oA khi 4 )n
h=y d5ng tag #t#+,kVu+te gt
G#+,kVu+teI
GhrI
Tr-nh $y +)n vn !n Tng tag #t#+,kVu+te gt sB #$% ,h+ +)n vn !n
,Ja )n n}i Rt hcnA v$ trang /e ,Ja )n trng ,Zng sB ,huyn nghi.p hcn2
[)n h=y thj xe%
GKhrI
GK#+,kVu+teI
7.2.Th/c h.h
C6i nhng ki1n thM, = h?, 89,A )n h=y xWy d'ng ,h+ %-nh %&t trang /e
,h|ng h)n nh8 %&t trang /e h86ng dqn h?, ti1ng ^nh v6i ,, h-nh !nhA siu
#in k1t v$ ,, ghi ,h; d5ng tag G#+,kVu+teI
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
K. ?. /0ng c@c J7 tL 5Mc b%,t
:.1.!i h"c
li khi tr+ng trang /e ,Ja )n ,4 ,, ko t' <, i.tA ,h|ng h)n nh8 ko t'
khng ph!i #$ ti1ng ^nhA %&t du nhn222 HTML Vuy (nh vi., hi*n th( ,, ko t'
4 nh8 sau

tr+ng 4 #$ tn %= ,h+ ,, ko t' <, i.t 42 [)n ,4 th* xe% panh s,h
,, ko t' <, i.t n$y * i1t th% ,hi ti1t2
CD dE n1u tr+ng phQn +dy ,4 +)n nh8 sauF
Ghe a#ign,enterIgtgtgt^`#ignti#deTHiN+a,utes#igyu%#
GKheI
Th- k1t Vu! trn tr-nh duy.t #$F
Tr+ng trang /e ,Ja )n nhiNu #;, ph!i hi*n th( ,, ko t' nh8 du #6n hcn (I"
h+<, du nhy hcn (G"A du v$ ("222A %$ ,, ko t' n$y tr5ng v6i ko hi.u ,Ja %&t
tag2 l* hi*n th( ,, ko t' n$yA HTML ,ung ,p ,h+ ta ,, ko hi.u thay th1 nh8
sauF
#t thay ,h+ G
gt thay ,h+ I
a%p thay ,h+
CD dEF l* hi*n th( I h ta vi1t nh8 sauF
gt h
ua ,, $i h?, tr86, )n = i1t rTng tr-nh duy.t /e y Vua tt ,! ,,
kh+!ng tr:ng tr+ng @i#e HTML2 Tuy nhin * tr-nh $y trang /e ,h+ ~pA )n
%ugn ,h{n kh+!ng tr:ng v$+ tr+ng trang /eA vD dE )n %ugn %&t kh+!ng tr:ng
sau du ,h% ,Wu hay sau du ph!yA ,h{n kh+!ng tr:ng v$+ Qu %vi +)n vn
!n222 Mugn ,h{n kh+!ng tr:ng ta d5ng ko hi.u
nsp
Ng+$i ,, ko hi.u = % t! P trnA HTML ,Sn ,ung ,p th% ,h+ ,h;ng ta %&t
sg ko hi.u <, i.t naA 4 #$F
,+py thay ,h+ W
reg thay ,h+
CD dE
:.2. Th/c h.h
U2T)+ %&t @i#e HTML sau 4 th% phQn sau v$+ tr+ng phQn +dy
HTML ,4 th* hi*n th( 89, ,, ko t' <, i.t nh8F
Gu#I
G#iI3, kot'#atinFgtgtgt^`#ignti#deTHiN+a,utes#igyu%#
G#iI3, du #6n hcnA nhy hcnA du v$ F gtnsp#tnspa%p
G#iI3, du 3+pyright v$ Trade%ark F ,+pynspreg
GKu#I
e2L8u ,ng vi., ,Ja )n v$ s+ snh v6i vD dE %quF
Ch 71 l* hi*n th( ;ng ,, du 3+pyright v$ Trade%ark n1u )n d5ng @+nt
Ti1ng Ci.t th- )n ph!i }i ,, du sang @+nt Ti1ng ^nh2
3ugi ,5ng ,h;ng ti 8a ra %&t !ng ,, ko t'A )n h=y 3#i,k v$+ Wy * xe%
!ng2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
N. O(! hnh nh )4 "#t tr!ng C&b
;.1.!i h"c
_au khi h?, ,, $i tr86, ,h:, )n vqn ,Sn th:, %:,A sa+ trang /e ,Ja %-nh
xu t.A khng gigng ,, trang trn dnternet %$ )n = tfng xe% Vua2
[-nh tnh i )n )A _au khi h?, $i n$yA )n sB ,4 th* 8a h-nh !nh v$+ trang
/e ,Ja %-nh v$ )n sB ,!% thy trang /e ,Ja %-nh ,Zng thRt hp dqn2
l* <t %&t h-nh !nh v$+ tr+ng trang /e ,Ja %-nh )n d5ng tag sau
Gi%g sr, LTn !nhLI
Tr+ng 4 LTn !nhL #$ tn ,Ja %&t @i#e !nh P ,5ng @+#der v6i @i#e HTML ,Ja )n2
CD dE F l* ,h{n %&t !nh ,4 tn #$ anhU2pg ta #$% nh8 sau
Gi%g sr, LanhU2pgLI
tag Gi%g222I ,Sn ,4 th* ,4 th% ,, thu&, tDnh * hi*n th( vn !n s+ v6i h-nh
!nh2 Thu&, tDnh a#ign v6i ,, gi tr( kh, nhau sB ,h+ ta ,, hi.u Mng nh8 sau2
U2 a#ign t+p
e2 a#ign %idd#e
H2 a#ign +tt+%
CD dE
Ng+$i ra thu&, tDnh n$y ,Sn ,4 %&t sg gi tr( kh, nh8F TextTopA AbsMiddleA
AbsBottom v$ Baseline2 3, )n h=y t-% hi*u th% Vua $i th', h$nh2
;.2.Th/c h.h
Tr86, khi 8a h-nh !nh v$+ tr+ng trang /e ,Ja )n %Xi )n d+0n#+ad %&t sg
h-nh !nh * #$% vD dE
U T)+ %&t @i#e HTML %6i v$ sj dEng ,, tag * th% !nh v$+ tr+ng trang /e
e2Thj th% ,, thu&, tDnh a#ign v$+ tr+ng tag i%g v$ s+ snh v6i k1t Vu! ,Ja
$i h?,
;..Th1m mt <= thuc t>.h ca tag 4img...8
1. Thu#c tPnh !lt Q R R.
>hi trang /e ,Ja )n 89, xe% Tng tr-nh duy.t %$ ng8Xi sj dEng t:t vi.,
tr-nh $y h-nh !nh * ti1t ki.% thXi gian d+0n#+adA thu&, tDnh a#t LL ,h+ php
thay th1 v$+ v( trD h-nh !nh %&t ,huvi vn !n % t! n42
CD dE
Gi%g sr, L22K]i,turesKp+0#+ad2pgL a#ign t+p a#t Lp+0n#+ad _+@t0areLI
3E% tf p+0n#+ad _+@t0are = thay th1 ,h+ h-nh !nh2
2. Thu#c tPnh ch%Bu c!4 ) ch%Bu r#ng.
l* ,h+ trang /e ,Ja )n 89, n)p nhanh hcnA )n nn 8a kD,h th86, ,Ja
!nh (tDnh Tng pixe#" v$+ tag Gi%gI2 3,h sj dEng ,, thu&, tDnh n$y #$F
Gi%g sr, LL 0idth xA height yI
xAy #$ ,hiNu r&ng v$ ,hiNu ,a+ ,Ja !nh2
8. Thu#c tPnh t34 )Sng Tu!nh nh.
Thu&, tDnh n$y #$% ,h+ kh+!ng ,,h gia M, !nh v$ ,, +)n vn !n 89,
thng th+ngA dm nh-n v$ ~p %:t hcn2 Hai thu&, tDnh ,4 tn #$ H_]^3` v$
C_]^3`F
Gi%g sr, LL hspa,e xA vspa,e yI
x #$ kh+!ng ,,h v5ng trgng P hai %<t tri v$ ph!i ,Ja M, !nh2
y #$ kh+!ng ,,h v5ng trgng trn tnh v$ y ,Ja M, !nh2
[)n sB 89, h?, kO hcn P $i h?, #Qn sau2
lgi v6i ,, thu&, tDnh n$yA n1u khng 8a th% v$+ t$ i%g th- tr-nh duy.t t'
&ng tDnh ,h;ng tr86, khi hi*n th(2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
U. Cn chVnh lB
?.1.!i h"c
U.1.!.?WF HXF )n bn )4 g%Y! tr!ng
Tr+ng ,, $i h?, tr86,A )n thy rTng trang /e ,Ja )n ,ht 89, ,n #N
n triA v$ )n %ugn tr-nh $y trang /e ,Ja %-nh ~p hcn Tng ,,h s:p
x1p ,, +)n vn !n v$+ gia trangA HTML ,4 nhiNu ,,h gi;p )n th', hi.n
iNu n$y2
3,h thM nhtF [)n <t +)n vn !n ,Qn s:p x1p v$+ gia trang nT% gia tag
G,enterI v$ GK,enterI
CD dEF
G,enterI in ,hu, %ung an GK,enterI
sB ,h+ k1t Vu! nh8 sauF
3,h thM eF l<t thu&, tDnh a#ign ,Ja tag GpI ,4 gi tr( #$ ,enter
CD dEF
Gp a#ign L,enterLI in ,hu, %ung an GpI
U.1.b.?WF HXF t(ng 5E% g%Y! )n bn ) hnh nh
>hi %ugn ,4 vn !n phJ xung Vuanh h-nh !nhA )n ,ht vi., th% thu&, tDnh
a#ign v$+ tag Gi%gI
CD dEF
Gi%g sr, L@i#ena%eL a#ign LrightLI
sB ,h+ k1t Vu!F
s+ v6i khng ,4 thu&, tDnh a#ignF
>hi vn !n h+<, nhng %E, kh, 89, s:p ,5ng v6i h-nh !nh kh ng:n v$ )n
%ugn zy vn !n k1 ti1p xugng n d86i h-nh !nhA )n h=y sj dEng tag GrI
v6i thu&, tDnh ,#earF
Gr ,#ear #e@tI
Gr ,#ear rightI
Gr ,#ear a##I
tag GrI v6i thu&, tDnh ,#ear sB x+ i tt ,! ,,h s:p x1p ,4 tr+ng tag Gi%gI
CD dEF
>hi ,h8a ,4 tag Gr ,#ear I
>hi ,4 th% tag Gr ,#ear a##I
>hi ,Qn tr-nh $y vn !n phJ Vuanh h-nh !nh v6i %&t kh+!ng ,,h nht (nh ta
d5ng th% ,, thu&, tDnh vspa,e v$ hspa,e tr+ng tag Gi%gI2 Tr+ng 4 vspa,e #$
kh+!ng ,,h gia n trn hay n d86i ,Ja h-nh !nh v$ vn !n ,Sn spa,e #$
kh+!ng ,,h gia n ph!i hay n tri ,Ja h-nh !nh v$ vn !n2
CD dEF
Gi%g sr, LanhU2pgL a#ign #e@t vspa,e U hspa,e eI
_+ v6i khi khng ,4 ,, thu&, tDnh vspa,e v$ hspa,e
U.1.c. ChVnh lB ) -WF HXF )n bn
Ng+$i ,, ,,h s:p x1p vn !n %$ )n = i1tA HTML ,Sn ,h+ ,h;ng ta th%
%&t tag ,n ,htnh vn !n naA 4 #$ GdivI 222 GKdivI2 C5ng vn !n ,h(u !nh
h8Png ,Ja tag n$y d'a v$+ thu&, tDnh a#ign2
Gdiv a#ign #e@tI 222 GKdivI
Gdiv a#ign rightI 222 GKdivI
Gdiv a#ign ,enterI 222 GKdivI
?.2. Th/c h.h
[Wy giX )n h=y t)+ %&t trang /e hi*n th( %&t tin n$+ 4A nh8 ,, trang tin ,Ja
CNN ,h|ng h)nA tr+ng 4 ,4 sj dEng ,, h-nh !nh %inh h+) ,h+ tin2 u ,Qu sj
dEng thu&, tDnh vspa,e v$ hspa,e * ,n ,htnh kh+!ng ,,h gia vn !n v$
h-nh !nh ,h+ ~pA sj dEng tagGdivI * ,anh #N ,h+ +)n vn !n2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
1Z. T34 c@c -%6u l%6n JXt
liNu th', s' #$% ,h+ /e n}i tr&i #$ kh! nng t)+ ra ,, %gi #in k1t 1n ,,
thng tin #in Vuan2 Nhng thng tin n$y ,4 th* nT% tr+ng ,hDnh trang /e hay
nT% P ,, trang /e kh, a+ gn% h-nh !nhA W% thanhA +)n phi%222
1@.1. Li1. A$t tBi mt file cCc D.
[Wy giX )n :t Qu t)+ %&t #in k1t tf trang /e ,Ja )n 1n %&t trang /e
thM hai2 Lin k1t n$y 89, g?i #$ ,E, & Pi v- trang /e thM hai ,Zng ,5ng nT%
trn %&t %y v6i trang /e Qu2
l* cn gi!n tr86, h1t )n t)+ %&t @i#e HTML thM hai v$ <t n4 ,5ng @+#der v6i
trang %$ )n = t)+ P ,, $i tr86,2
Mugn t)+ %&t siu #in k1t ta d5ng
Ga hre@ L@i#ena%e2ht%LI Cn !n )i di.n ,h+ %gi #in k1t GKaI
[t ,M +)n vn !n n$+ nT% gia
Ga hre@ L L I v$ GKaI Nu #$ %&t siu vn !n #in k1t t6i ,, trang /e kh, v$
n4 89, g),h d86i2
ThLc hnh
U2T)+ %&t trang /e kh, gi! sj #$ vidu2ht% v$ #8u v$+ ,5ng Y+#der v6i trang
/e ,Ja )n2
e2Tr+ng trang /e %$ )n ,Qn t)+ siu #in k1t t6i )n th% tag t)+ siu #in k1t
nh8 sau F
Ga hre@ Lvidu2ht%LIe% vD dE UGKaI
H2L8u #)i ,ng vi., ,Ja )n v$ %P trn tr-nh duy.t2 >hi 4 )n sB thy +)n vn
!n e% vD dE 89, t)+ th$nh siu #in k1tA n4 89, }i th$nh %$u xanh v$ khi
)n 8a ,hu&t v$+ v5ng vn !n n$y th- ,hu&t ( }i th$nh h-nh $n tay v$ n1u
)n % ,hu&t th- sB 89, 8a t6i trang ,4 tn #$ vidu2ht%
[)n ,Zng ,4 th* #in k1t t6i %&t h-nh !nh Tng ,,h thay tn @i#ena%e2ht% Tng
%&t @i#e !nh2 CD dEF
Ga hre@ L#+g+2gi@LI Text GKaI
T6i Wy ,h:, )n #)i ,4 th:, %:,A %ugn #in k1t t6i th8 %E, kh, h+<, th8 %E,
,a+ hcn th- #$% th1 n$+x l* th', hi.n iNu 4 %Xi )n xe% ti1p phQn sau Wy2
ui! sj ,u tr;, @+#der ,Ja )n ,4 d)ng
|--My Web
| |--Pictures
| | |--i-today.gif
| |--Trang web ca DE. F GH tr> .)
C$ )n %ugn #in k1t t6i d-t+day2gi@A khi 4 trang tag Ga hre@ 22I )n sja #)i nh8
sau
Ga hre@ L]i,turesKi-t+day2gi@LI 222 GKaI
3Sn tr+ng tr8Xng h9p @i#e )n ,Qn t)+ #in k1t ,4 ,u tr;, @+#der ,a+ hcn
CD dEF
I66Jicture<1
|--My Web
| |--Pictures
| | |--i-today.gif
| |--Trang web ca DE. F GH tr> .)
v$ )n ,Qn #in k1t t6i !nh P tr+ng Y+#der ]i,turesU ,4 ,p ,a+ hcn th8 %E,
,hMa trang /e ,Ja )nA khi 4 )n ,Qn sja #)i tag nh8 sauF
Ga hre@ L22Kpi,turesUK22LI GKaI
%vi #Qn xut hi.n L22KL + ,+ ,h+ tr-nh duy.t t-% ki1% P %&t @+#der ,4 ,p ,a+
hcn2
ThLc hnh
[Wy giX )n h=y p dEng ,, ,,h #in k1t t6i @i#e P Y+#der ,5ng ,p v$ ,p ,a+
hcn2 >hi th)+ ,, ,,h #in k1tA khi xWy d'ng trang /e )n ,4 th* * tt ,! ,,
!nh tr+ng ,5ng %&t Y+#der v$ #in k1t t6iA iNu n$y #$% ,h+ vi., thay }iA ,Rp
nhRt trang /e 89, thuRn ti.n hcn2
Th6" "#t cht )B )n 5B -%6u l%6n JXt
l* ,h+ trang /e ,Ja )n ,4 v7 ,huyn nghi.p hcnA Wy giX )n h=y }i tn
th$nh index2ht%2 liNu n$y 89, #o gi!i nh8 sauF
CD dE khi )n v$+ trang d-t+day )n sB gw v$+ dSng (a ,ht ,Ja tr-nh duy.t
httpF KK0002vnn2vnKi-t+dayK
Th', ra khi 4 tr-nh duy.t sB ?, @i#e
httpF KK0002vnn2vnK i-t+dayK index2ht%2
1@.2. Li1. A$t *$. cKc tra.g LeD AhKc tr1. M.ter.et
l* #in k1t t6i %&t trang /e kh, trn dnternet ta d5ng tag sauF
Ga hre@ LLLI Text GKaI
Tr+ng 4 L (ni@+r% es+ur,e L+,at+r" ,h+ i1t (a ,ht %$ )n %ugn #in k1t
t6i2
CD dE vN ,, L
httpFKK0002hut2edu2vn
httpFKK 0002vnn2vn
httpFKK0002vnn2vnKi-t+day
%ai#t+Fhungndav+#2vnn2vn
ThLc hnh
U2T)+ %&t @i#e HTML v$ th% +)n sau v$+ tr+ng phQn +dy
Gu#I
G#iIGa hre@ LhttpFKK0002hut2edu2vnLITr8Xng l)i h?, [,h kh+a H$ n&iGKaI
G#iIGa hre@ LhttpFKK0002vnn2vnKi-t+dayLIT)p ,hD 3ng ngh. Thng tin dnternet
T+dayGKaI
G#iIGa hre@L%ai#t+Fhungndav+#2vnn2vnLIuji th8 ,h+ TrQn Ci.t H5ngGKaI
GKu#I
e2 L8u ,ng vi., ,Ja )nA sau 4 %P tr-nh duy.t v$ s+ snh v6i vD dE2 [)n ,4
th* ki% tra ,, siu #in k1t Tng ,,h di ,hu&t v$+ v5ng vn !n siu #in k1t
v$ xe% thng + P thanh tr)ng thi ,Ja tr-nh duy.tA thanh tr)ng thi sB hi*n th(
L %$ )n sB #in k1t t6i2
1@.. Li1. A$t tBi cKc NhO. tr-.g cP.g mt tra.g
HTML khng nhng ,h+ )n t)+ #in k1t 1n ,, trang /e kh, nT% P ,5ng
%y tDnh v6i trang /e ,Ja )n h+<, trn dnternetA %$ ,Sn ,h+ php )n #in k1t
1n ,, phQn tr+ng ,5ng %&t trang2
l* #in k1t 1n ,, phQn ,Ja %&t trang tr86, h1t )n ph!i <t tn ,h+ phQn ,Qn
#in k1t t6i2 ThJ tE, n$y 89, th', hi.n Pi tag
Ga na%eLLI GKaI
Tr+ng 4 na%e #$ %&t tn d+ )n <t ra
_au 4 n1u )n ,Qn #in k1t t6i phQn = <t tn )n ,ht ,Qn d5ng
Ga hre@ Lna%eLI Text t+ #ink GKaI
T8cng t' khi #in k1t t6i ,, t$i #i.u kh, ta ,4 th* d5ng
Ga hre@ Lv+#U2ht%na%eI Text GKaI
Ga hre@ LLna%eI Text GKaI
CD dE F3#i,k v$+ Wy * vN Qu trang
1@.0. TE- cKc <i1u li1. A$t DQ.g h.h &.h
Nh8 )n vqn th8Xng thy tr+ng ,, trang /eA ,, siu #in k1t khng ,ht #$ ,,
+)n vn !n %$ ,Sn ,! Tng h-nh !nh naA iNu n$y ,$ng #$% ,h+ /e trP
nn hp dqn2 ]hQn n$y gi6i thi.u ,h+ )n ,,h t)+ ,, siu #in k1t Tng h-nh
!nhF
Ci., Qu tin #$ )n ,h?n U !nh nT% ,5ng th8 %E, K@+#der v6i trang /e ,Ja
)nA gi! sj 4 #$ graph2pg2 >hi 4 )n sj dEng ,, Tag nh8 sau
Ga hre@ L@i#e2ht%LI Gi%g ser Lgraph2pgLIGKaI
[)n #8u o #$ tag Gi%g22I nT% gia tag Ga hre@ 222I v$ GKaI
>hi %&t !nh 89, d5ng #$% siu #in k1tA sB ,4 %&t h&p %$u ,4 %$u ,Ja ,,
siu #in k1t a+ Vuanh !nh
L(u 71 Ci., 8a %&t h-nh !nh #6n v$+ tr+ng trang /e #$% ,h+ ng8Xi ?, ph!i
%t thXi gian ,hX t!i v- vRy )n nn sj dEng %&t sg %~+ sauF
U2 l* N phSng ng8Xi ?, tt ,h1 & hi*n th( h-nh !nh ,Ja tr-nh duy.tA )n nn
th% thu&, tDnh a#t L222L v$+ tag Gi%g222I * ng8Xi ?, dm (nh h86ng
e2 >hi ,Qn gi6i thi.u %&t h-nh !nh #6nA )n nn t)+ %&t h-nh !nh thu nhy ,Ja n4
v$ 8a v$+ trang /e #$% siu #in k1t t6i !nh #6nA nh8 th1 r %t thXi gian
d+0n#+ad trang /e ,Ja )nA vD dE )n h=y 3#i,k ,hu&t v$+ !nh sau F

ThLc hnh
[Wy giX )n h=y t)+ %&t @i#e HTML %$ phQn Qu 89, tr-nh $y the+ ki*u %E,
#E,A %vi %E, #in k1t t6i phQn n&i dung t8cng Mng tr+ng ,5ng vn !nA P ,ugi
%vi phQn n&i dung ,4 %&t !nh #$% siu #in k1t * + Vuay trP #)i Qu t$i #i.u2
Trng gigng nh8 sau
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
11. Th6" 5:! chV< l%6n JXt [\"!%l )4 tr!ng C&b c! b3n
11.1. !i h"c
Nh8 )n vqn th8Xng thy tr+ng ,, trang /e trn dnternetA phQn ,ugi %vi trang
th8Xng ,4 ,, thng tin vN trang /eA ,h|ng h)n nh8F
Tiu N hay ,hJ N ,Ja trang hi.n thXi
Ng$y ,Rp nhRt gQn Wy nht
[!n VuyNn
Tn v$ `-%ai# ,Ja t, gi! ,Ja trang /e
222
]hQn n$y g?i #$ @++ter ,Ja trang /e2 l* th% @++ter v$+ trang /eA HTML
,ung ,p ,h+ ,h;ng ta tag GaddressI v$ ,,h sj dEng nh8 sau
GaddressI
222
G\-- ,, thng tin--I
222
GKaddressI
Tt ,! vn !n nT% tr+ng tag GaddressI 89, in Tng ki*u ,h nghingA tuy
nhin )n ,4 th* thay }i ,,h hi*n th( ,Ja ,h;ng Tng ,,h sj dEng ,, tag =
h?,2
11.2.Th/c h.h
U2T)+ %&t @i#e HTMLA sau khi th% ,, phQn thng tin ,h+ trang /eA )n th%
+)n sau v$+ ,ugi phQn +dy
GaddressI
GhrI
Gp a#ign L,enterLI
3huyn %E, 3hWn trXi tri thM, - T)p ,hD dnternet T+dayGrI
3+pyright a e y C^_3GrI
l(a ,ht F Tri.u Ci.t C8cng - H$ n&iGrI
`%ai# F Ga hre@L%ai#t+Fi-t+dayavas,2vnn2vnLIi-t+dayavas,2vnn2vnGrIGKaI
M?i o ki1n vN & s,h HTML xin gji vNF TrQn Ci.t H5ngGrI
`%ai# FGa hre@ L%ai#t+Fhungndav+#2vnn2vnIhungndav+#2vnn2vnGKaI
GKpI
GKaddressI
e2L8u ,ng vi., ,Ja )n v$ s+ snh v6i vD dE %quF
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
Phn 2. '=ng c!4
12. T34 c@c /!nh -@ch
12.1. !i h"c
panh s,h 89, d5ng * tr-nh $y thng tin th$nh %&t d)ng dm ?, hcn2 3h|ng
h)n * t)+ ra ,, !ng ,ht %E,A n&i dung ,Ja %&t d=y ,, t$i #i.u hay ,,
,h8cng2
HTML ,4 hai ki*u danh s,hA danh s,h ,4 thM t' (+rdered" v$ danh s,h khng
,4 thM t' (un+rder"2
]!nh -@ch Jh^ng c2 thA tL.
panh s,h khng ,4 thM t' ,4 ,, %E, :t Qu Tng ,, Lut##etL h+<, ,, ko
hi.u nh du P tr86,2 l* t)+ ra danh s,h khng ,4 thM t' ta d5ng ,, tag
sauF
Gu#I
<li>3ht %E, thM nht
...
<li>3ht %E, ,ugi
</ul>
CD dE khi tr+ng phQn +dy ,Ja @i#e HTML ,Ja )n ,4 +)n nh8 sauF
<h3>3, & %n tr+ng kh+a 3ng ngh. Thng tin tr8Xng l)i h?, [,h kh+a H$
n&iGKhHI
Gu#I
G#iI[& %n >h+a h?, %y tDnh
G#iI[& %n >O thuRt %y tDnh
G#iITrung tW% %y tDnh
G#iI]hSng thD nghi.% Lin %)ng
GKu#I
Th- trn tr-nh duy.t danh s,h 89, hi*n th( nh8 sau F
]!nh -@ch c2 thA tL
panh s,h ,4 thM t' #$ danh s,h %$ %vi %E, ,Ja danh s,h 89, nh sgA
th8Xng :t Qu tf LUL2 l* t)+ ra danh s,h ,4 thM t' ta d5ng ,, tag sauF
G+#I
G#iI3ht %E, thM nht
222
G#iI3ht %E, ,ugi ,5ng
</ol>
panh s,h ,4 thM t' ,ht kh, danh s,h khng ,4 thM t' P ,hv thay tag Gu#I
Tng tag G+#I2
CD dE F N1u tr+ng phQn +dy ,Ja @i#e HTML ,4 +)n
GhHI3, 86, ,huzn ( * h?, HTMLGKhHI
G+#I
G#iI3h8cng tr-nh s+)n th!+ vn !n trcn (nh8 N+te]ad ,Ja /ind+0s"
G#iITr-nh duy.t /e(nh8 dnternet `xp#+rer h+<, Nes,ape Navigat+r"
G#iI[& s,h vN HTML ,Ja t)p ,hD dnternet T+day
GK+#I
]!nh -@ch 5:nh ngh_! `definition listsa
panh s,h (nh ngha khng ,4 ,, ,ht %E, Qu dSng2 _au khi k1t th;, tag GdtIA
n4 t' &ng xugng dSngA vi1t thEt v$+ h.t nh8 ,, (nh ngha tr+ng s,h gi+
kh+a vRy2
CD dEF
* ,4 trang 0e trnA )n ph!i nh +)n %= sauF
GhHICD dE vN danh s,h (nh nghaGhHI
Gd#I
GdtIl(nh ngha UGKdtI
GddIgi!i thD,h (nh ngha U2GKddI
GdtIl(nh ngha eGKdtI
GddIgi!i thD,h (nh ngha eGKddI
GdtIl(nh ngha HGKdtI
GddIgi!i thD,h (nh ngha H2GKddI
</dl>
Tr+ng trang /e * t)+ ra ,, %E, thng tin ,4 ,u tr;, #+gi, hcn )n ,4 th*
#nng ,, danh s,h v6i nhau2
CD dE vN tr&n danh s,h
GhHICD dE vN tr&n danh s,hGKhHI
G+#I
G#iI 3ht %E, U
Gu#I
G#iI 3ht %E, ,+n U
G+#I
G#iI 3ht %E, ,+n U
G#iI 3ht %E, ,+n e
GK+#I
G#iI 3ht %E, ,+n e
GKu#I
G#iI 3ht %E, ,+n
GK+#I
Ta ,4 danh s,h nh8 sau F
12.2.Th/c h.h
l8a danh s,h v$+ trang /e ,Ja )n
U2 MP %&t @i#e HTML %6iA tr+ng phQn +dy )n t)+ %&t danh s,h Tng ,, tag
HTML nh8 sau F
GhHIME, #E,GKhHI
Gu#I
G#iI3h8cng %&t
G+#I
G#iIui6i thi.u ,hung
G#iINhng ki1n thM, vr #Sng vN HTML
GK+#I
G#iI3h8cng hai
G+#I
G#iI3, tag thng dEng
Gu#I
G#iITag (nh d)ng kiNu ,h
G#iITag ,h{n !nh
GKu#I
G#iI3, tag trang trD trang /e
GK+#I
G#iI3h8cng a
Gu#I
G#iI3, trang /e %qu
G#iI>1t th;,
GKu#I
GKu#I
e2 L8u ,ng vi., ,Ja )n2 MP trn tr-nh duy.t v$ s+ snh v6i vD dE %qu
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
18. Tr!ng trP ch4 )n bn
1.1.!i h"c
ua ,, $i h?, tr86, )n = i1t ,,h th% %$u s:, ,h+ nNn v$ vn !n thng
Vua vi., thi1t #Rp ,, thu&, tDnh ,h+ tag G+dyI2 Tr+ng $i n$y )n sB h?, ,,h
thay }i %$u s:,A kD,h th86,A @+nt ,h ,Ja phQn vn !n tr+ng trang /e ,Ja
)n2
18.1.!.Cb $4nt
>hi %ugn thay }i ,r @+nt th- d5ng
G@+nt sie I 222 GK@+ntI
Tr+ng 4 #$ ,r @+nt ,4 gi tr( tf U (nhy nht" 1n (#6n nht"
CD dEF
3r @+nt U
3r @+nt e
3r @+nt H
222
3r @+nt
Ng+$i ra HTML ,Sn ,h+ ,h;ng ta %&t ,,h kh, * th', hi.n vi., thay }i ,r
@+ntA thay }i t8cng gi
G@+nt sie I 222 GK@+ntI
G@+nt sie - I 222 GK@+ntI
Tr+ng 4 A - #$ & d(,h ,huy*n s+ v6i ,r @+nt hi.n t)i2 3h;ng th8Xng 89,
d5ng ,5ng v6i tag
Gase@+nt sie I
F 3r @+nt %ugn <, %<, (nh
3h; oF Tag Gase@+ntI khng ,4 tag 4ng #)iA n4 ,4 t, dEng ,h+ 1n khi g<p
%&t tag Gase@+ntI kh,2
18.1.b.K%9u $4nt
l* #$% ,h+ trang /e th% sinh &ngA nhiNu khi )n %ugn tr-nh $y n4 Tng
nhiNu ki*u @+nt kh, nhauA )n h=y sj dEng thu&, tDnh @a,e ,Ja tag G@+ntI *
th', hi.n vi., }i @+nt ,h2
G@+nt @a,e L@+ntna%eLI 222 GK@+ntI
tr+ng 4 @+ntna%e #$ tn ,Ja @+nt ,h ,4 trn %y tDnh ,Ja ng8Xi ?, trang
/e2
Mugn th% %$u s:, ,h+ ,hA ta th% thu&, tDnh ,+#+r v$+ tag @+nt
CD dEF
G@+nt @a,e L^ria#L ,+#+r LYYYYYYLI 222 GK@+ntI
G @+nt @a,e L2CnHpHL ,+#+r L``[[[[LI222GK@+ntI
18.1.c.H%9n th: chV -E tr6n ) chV -E /(c%
>hi ,Qn ph!i tr-nh $y ,ht sg trn hay ,ht sg d86iA nh8 ,, ,ng thM, h+ h?,
,h|ng h)n ,h;ng ta sj dEng ,, tag GsupI 222 GKsupI ,h+ ,ht sg trn v$
GsuI 222 GKsuI ,h+ ,ht sg d86i2
CD dEF
l* ,4 NH
h
A ta ph!i vi1t
NHGsuIhGKsuI
l* ,4 x
e
ta ph!i vi1t
xGsupIeGKsupI
1.2. Th/c h.h
[)n thWn %1nA )n = h?, 89, kh nhiNu ki1n thM, vr #Sng vN HTMLA Wy giX
)n h=y p dEng nhng ki1n thM, = h?, * t)+ ,h+ %-nh %&t trang /e v6i
%$n h-nh nNn ,4 %$u s:,A ,, #+)i @+nt ,h kh, nhauA ,, h-nh !nh v$ siu #in
k1t222>hi = #$% nhiNu trang /e )n sB ,4 nhiNu kinh nghi.% tr+ng vi., ,h?n
@+nt ,hA ,h?n %$u s:, 222 tf 4 )n %6i ,4 th* xWy d'ng 89, nhng trang
/e ~p 89,2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
1>. Th6" "u -Wc ch4 tr!ng C&b c! b3n
10.1.!i h"c
Tf khi h?, $i Qu tin 1n Wy giXA ,h:, nhiNu khi )n th:, %:,F LT)i sa+
trang /e ,Ja %-nh #)i ,ht ,4 hai %$u en v$ tr:ngA tr+ng khi ,, trang /e
%-nh nh-n thy Nu 89, trang trD rt ~pL2 in )n h=y yn tW%A $i n$y sB gi;p
)n gi!i Vuy1t th:, %:, 42
1>.1.!.C bn )B "u -Wc
Tr+ng %&t tr-nh duy.t /eA )n ,4 th* sj dEng eks %$u * trang trD ,h+ vn
!n v$ nNn2 Mvi %$u 89, x, (nh Pi & a ed-ureen-[#ue (u["A ,, gi
tr( ,Ja A uA [ tf 1n ekk th* hi.n ,8Xng & ,Ja n42 CD dE khi ,! a ,4 gi tr(
nhy nht (0A u0A [" th- sB ,h+ ta %$u en v$ khi ,! a ,4 gi tr( #6n nht
(ekkA uekkA [ekk" th- ,h+ ta %$u tr:ng2 [& a u[ v6i ,, gi tr( kh,
nhau sB ,h+ ta ,, %$u kh, nhau2
Tr+ng HTMLA khi %ugn sj dEng %&t %$u n$+ 4A thay v- d5ng ,, gi tr( ,Ja A
uA [ P h. thRp phWnA )n ph!i i*u dimn ,h;ng P d)ng h. Us2
CD dEF
M$u tr:ng Mng v6i ekkA uekkA [ekk 89, i*u dimn #$ YYYYYY2
M$u LhkeY`L tM, #$ hk (H. Us"
u e (H. Us"
[ Y` (H. Us"
t8cng 8cng v6i s (H. U"
u He (H. U"
[ ekh (H. U"
CD dE vN %&t sg %$u thng th8Xng
1>.1.b.Mu nBn cE 5:nh
l* th% %$u ,h+ trang /e ,Ja %-nhA )n h=y th% ,, thu&, tDnh sau v$+
trang tag G+dyI
g,+#+r
text
#ink
v#ink
Tr+ng 4
g,+#+r , (nh %$u s:, ,Ja nNn
text , (nh %$u s:, ,Ja vn !n
#ink , (nh %$u s:, ,Ja siu #in k1t
v#ink , (nh %$u s:, ,Ja siu #in k1t = xe% Vua
,Sn #$ ko hi.u %$u P d)ng thRp #E, phWn (,4 du P tr86,"
CD dEF
G+dy g,+#+r text ````[[ #ink HH33YY v#ink 33I
_B ,h+ nNn %$u enA ,h %$u v$ngA siu #in k1t %$u xanh d8cng sngA siu
#in k1t = xe% %$u y2
_au Wy #$ %&t sg %$u ,c !n v$ ko hi.u t8cng Mng
C-l-r HeR C-Se C-l-r HeR C-Se
xx oo xx FFCCCC

xx oo xx 3300FF
xx oo xx 33FF66

xx oo xx AA0000
xx oo xx 663300

xx oo xx 9900FF
xx oo xx 000077

xx oo xx FFFF00
xx oo xx EEEEEE

xx oo xx 888888
xx oo xx 444444

xx oo xx 000000
C-l-r Tame C-l-r Tame
xx oo xx aqua

xx oo xx black
xx oo xx blue

xx oo xx fuchsia
xx oo xx gray

xx oo xx green
xx oo xx lime

xx oo xx maroon
xx oo xx navy

xx oo xx olive
xx oo xx purple

xx oo xx re
xx oo xx silver

xx oo xx !eal
xx oo xx "hi!e

xx oo xx yello"
1>.1.c.Tr!ng trP nBn bdng hnh nh
N1u )n %ugn %$u nNn ,Ja trang /e ,Ja )n ~p hcnA )n ,4 th* d5ng %&t
@i#e !nh nhy * trang trD ,h+ nNn2 >hi 4A HTML sB t)+ ,, !n sa+ #in tE, ,Ja
@i#e !nh * phJ h1t nNn ,Ja trang /e2
l* d5ng h-nh !nh #$% nNn ,h+ trang /eA ta d5ng thu&, tDnh a,kgr+und tr+ng
tag G+dyI
G+dy a,kgr+und L@i#ena%eLI
Tr+ng 4 @i#ena%e #$ tn @i#e !nh %$ )n d5ng #$% nNn2
10.2.Th/c h.h
U2T)+ %&t @i#e HTML v$ ,huzn ( %&t h-nh !nh * #$% nNnA vD dE !nh sau ,4 tn
#$ stra02pg
Th% v$+ tag +dy thu&, tDnh a,kgr+und nh8 sauF
G+dy a,kgr+und Lstra02pgLI
e2L8u ,ng vi., ,Ja )nA %P trn tr-nh duy.t v$ s+ snh v6i vD dE %quF
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
1G.Th6" "#t cht )B -%6u l%6n JXt bdng hnh nh
19.1.!i h"c
Tr+ng ,, $i h?, tr86,A )n = h?, 89, ,,h t)+ ,, siu #in k1t Tng
h-nh !nh2 [$i n$y sB ,ung ,p ,h+ )n t)+ ra nhiNu siu #in k1t tf ,5ng %&t
h-nh !nh Tng ,,h ,hia h-nh !nh 4 th$nh ,, v5ngA %vi v5ng #in k1t t6i %&t
trang /e kh, nhau2 Tr86, h1t %Xi )n xe% vD dE sau F
- C6i h-nh !nh nh8 sau F

- _au khi 89, kh+anh v5ng v$ t)+ ,, siu #in k1tA Wy giXA !nh trn sB 89,
#in k1t t6i nhiNu trang /e kh,A )n h=y thj ,#i,k v$+ ,, tn t8cng Mng trn
!nh v$ xe% k1t Vu!2
l* t)+ ra 89, %&t h-nh !nh v6i nhiNu #in k1tA t6i nhiNu trang /e kh, nhauA
HTML ,ung ,Wp ,h+ ,h;ng ta tag G%apIA ,,h #$% nh8 sau F
U23huzn ( %&t h-nh !nh * t)+ ,, siu #in k1t F Tr+ng vD dE trnA !nh ,4 tn #$
F #ienket2pgA khi 8a h-nh !nh n$y v$+ trang /eA tr+ng tag Gi%gI )n sj dEng
thu&, tDnh use%ap nh8 sau F
Gi%g sr, L#ienket2pgL use%ap L%apna%eLI
tr+ng 4 %apna%e #$ phQn %$ )n (nh ngha ,, v5ng ,Ja !nh * tf 4 t)+
,, siu #in k1t2
e2l(nh ngha ,, v5ng * t)+ siu #in k1t F l* t)+ ,, v5ng ta sj dEng tag
G%apI nh8 sau F
G%ap na%e L%apna%eLI
Garea shape Lre,tL ,++rds LxUAyUAxeAyeL hre@ LLLI
Garea shape Lre,tL ,++rds LxhAyhAxkAykL hre@ LLLI
2222
GK%apI
Tr+ng 4 tag GareaI (nh ngha %&t v5ng ,4 h-nh #$ thu&, gi tr( ,Ja thu&, tDnh
shape LLA ,4 t+) & #$ gi tr( ,Ja thu&, tDnh ,++rds LLA tr+ng vD dE trn v5ng
t)+ siu #in k1t #$ v5ng h-nh ,h nhRt (re,t" ,4 t+) & g4, trn n tri #$ xUAyU
t+) & g4, d86i n ph!i #$ xeAye v$ #in k1t t6i trang /e #$ gi tr( ,Ja thu&,
tDnh hre@ LL
l+)n %= HTML ,Ja vD dE trn nh8 sau F
G%ap na%eLY]MapLI
Garea hre@LhttpFKK0002hut2edu2vnL shapeLre,tL ,++rdsLA UA UhA HhLI
Garea hre@LhttpFKK0002vnn2vnL shapeLre,tL ,++rdsLUHA hA HA seLI
Garea hre@LhttpFKK0002t#net2,+%2vnL shapeLre,tL ,++rdsLHHA A UHA ULI
Garea hre@LhttpFKK0002netna%2vnL shapeLre,tL ,++rdsLkHA UA UkA UHeLI
Garea hre@LhttpFKK0002@pt2vnL shapeLre,tL ,++rdsLUA UHkA UhsA UkLI
GK%apI
Gi%g +rderLLsr,Ld%ageK#ienket2pgL use%apLY]MapL
0idthLULheightLUseLI
19.2.Th/c h.h
[Wy giX )n h=y ,huzn ( %&t h-nh !nh v$ d5ng tag G%apIA v$ thj t)+ %&t trang
/e ,4 ,, siu #in k1t xut pht tf %&t h-nh !nh nh8 tr+ng $i h?,2 3h;, )n
th$nh ,ng2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
1I. eng
17.1. !i h"c
Ci., tr-nh $y trang /e the+ d)ng !ng sB #$% ,h+ trang /e ,Ja )n ,huyn
nghi.p hcn2 C6i d)ng !ng )n ,4 th* ,hia trang /e th$nh nhiNu phQnA )n ,4
th* p dEng ,, ki1n thM, = h?, * trang trD ring ,h+ tfng phQn222
>hi xWy d'ng !ngA )n h=y nh6 Vuy t:, sauF :t Qu tf ,a+ nht n triA ti1p
the+ xWy d'ng ,, ,Ja h$ng Qu tinA sau 4 ,huy*n xugng h$ng thM haiA xWy
d'ng ,, phQn tj ,Ja h$ng thM e222
--I --I --I --I ---I --I

----------------------------

--I --I --I --I ---I --I


1I.1.!. 'hYng t!g c bn c! bng
l* t-% hi*u vN ,, tag ,c !n ,Ja !ngA tr86, h1t ta xt vD dE sau2
Gta#e +rder UI
GtrI
GtdI H$ng U ,&t U GKtdI
GtdI H$ng U ,&t e GKtdI
GtdI H$ng U ,&t H GKtdI
GKtrI
GtrI
GtdI H$ng e ,&t U GKtdI
GtdI H$ng e ,&t e GKtdI
GtdI H$ng e ,&t H GKtdI
GKtrI
GKta#eI
Tr+ng tag Gta#eI ta thy thu&, tDnh +rder ,4 gi tr( #$ UA iNu n$y ngha #$ vB U
8Xng viNn Vuanh !ng v6i & d$y #$ U i*%2
Mvi h$ng 89, x, (nh Pi GtrI v$ GKtrI vi1t t:t ,Ja ta#e r+02
Mvi 89, (nh ngha Pi GtdI v$ GKtdI vi1t t:t ,Ja ta#e data2
l* ,n ,htnh #N tr+ng %vi A )n th% ,, thu&, tDnh sau v$+ tag GtdI2
3htnh #N the+ ,hiNu ngang
Gtd a#ign #e@tI s:p x1p vN n tri
Gtd a#ign rightI s:p x1p vN n ph!i
Gtd a#ign ,enterI s:p x1p v$+ gia
1I.1.b. C@c hng ) c#t
[!ng %$ )n t)+ P trn %6i ,ht #$ !ng cn gi!n v6i a h$ng v$ a ,&t Nu
nhau2
[)n h=y ,h; o ,, !ng sau2
[!ng U
[!ng e
[!ng H
l* t)+ 89, nhng !ng nh8 trnA ,h;ng ta sj dEng ,, thu&, tDnh ,+#span v$
r+0span tr+ng tag GtdI 222 GKtdI
Thu&, tDnh ,+#spanx ,4 t, dEng %P r&ng ,&t ,Ja !ngA vD dE tr+ng !ng U *
%P r&ng thM e ,Ja h$ng U ra r&ng Tng hai ,&t -nh th8Xng ta <tF
Gtd ,+#span eIH$ng U ,&t e-HGKtdI
Thu&, tDnh r+0span ,4 t, dEng %P r&ng h$ng ,Ja !ngA tr+ng !ng e * %P
r&ng thM e ,Ja h$ng e ra r&ng Tng e h$ng -nh th8Xng ta <tF
Gtd r+0span eIH$ng e-H ,&t eGKtdI
1I.1.c. O%Bu Jh%9n HuEng hng tr4ng "#t ^.
Tr+ng %&t A n1u %ugn gi dSng vn !n trn %&t dSngA tM, #$ khng ,h+ n4
xugng h$ng th- th% thu&, tDnh Ni/^] v$+ tr+ng tag GTpI h+<, GTHI2
1I.1./. Th6" 5u 5B )4 bng `c!Ft%4na
Ngay sau tag Gta#eIA )n gw v$+ tag G,atpi+nI t'a N ,Ja !ngA v$ k1t th;,
Tng tag 4ng GK,apti+nI
Gta#e I
G,apti+n a#ignL,enterL va#ignLt+pLIGuIT'a N ,Ja !ngGKuI GK,apti+n I
GtrIGtd 0idthLkL a#ignL,enterLI3&t U - dSng UGKtdI
Gtd 0idthLkLI3&t e - dSng UGKtdI
GKtrI
GtrIGtd 0idthLkL a#ignL,enterLI3&t U - dSng eGKtdI
Gtd 0idthLkLIGp a#ignL,enterLI3&t e - dSng eGKtdI
GKtrI
GKta#eI
GK+dyI
Tr+ng tag G,apti+nI )n thy ,4 thu&, tDnh va#ignLt+pLA ngha #$ t)+ t'a N P
trn tnh ,Ja !ng2 N1u va#ignL+tt+%L th- t'a * ,Ja !ng sB P y !ng2
1I.1.&.Th6" c@c th^ng -E ch4 c@c 5(fng )%Bn t34 r! bng
Mugn thay }i thng sg ,Ja ,, 8Xng t)+ !ng ta th% ,, thu&, tDnh ,h+ tag
Gta#eI nh8 sauF
Gta#e +rder ,e##padding ,e##spa,ing I
F 3hiNu r&ng 8Xng viNn ng+$i !ng
F L>h+!ng tr:ngL gia d #i.u n tr+ng v$ v,h ngn ,Ja
F l& r&ng ,Ja nhng 8Xng n tr+ng !ng * ,hia ,,
CD dE !ng sau ,4 tag Gta#eI nh8 sauF
Gta#e +rderH ,e##paddingh ,e##spa,ingI
>hi +rder th- ta sB ,4 %&t !ng khng ,4 t kb %&t 8Xng viNn n$+2 p5ng
!ng d)ng n$y * s:p x1p vn !n the+ ,, h$ng th|ng Mng2 lgi v6i d #i.u
tr+ng !ng )n vqn ,4 th* p dEng ,, tag = h?, nh8 vD dE sau Wy ,hia %$n
h-nh th$nh hai ,&t danh s,h tr+ng 4 %vi ,&t #$ %&t siu #in k1t
Gdiv a#ign,enterI
GheI3, /esite P vi.t na%GKheI
Gta#e +rderLL ,e##padding e ,e##spa,ing eI
GtrI
Gtd a#ign#e@tIGa hre@ LhttpFKK0002vnn2vnLI 3ng ty C^_3 - CNNGKaI GKtdI
Gtd IGa hre@ LhttpFKK0002t#net2,+%2vnLI M)ng ]h8cng na%GKaIGKtdI
GKtrI
GtrI
GtdIGa hre@ LhttpFKK0002@pt2vnLI3ng ty Y]TGKaIGKtdI
Gtd IGa hre@ LhttpFKK0002saig+nnet2vnLI_$i gSn netGKaIGKtdI
GKtrI
GtrI
GtdIGa hre@ LhttpFKK0002netna%2vnLI 3ng ty Netnaa%GKaIGKtdI
GtdIGa hre@ LhttpFKK0002vina+ne2,+%2vnLIM)ng ,Ja [& th8cng %)iGKaIGKtdI
GKtrI
GKta#eI
GKdivI
1I.1.$.Th6" "u -Wc ch4 bng
l* t %$u ,h+ !ngA ta th% thu&, tDnh g,+#+r v6i gi tr( %$u t8cng Mng v$+
,, tag ,Ja !ng2 T %$u nNn ,h+ t+$n !ng
Gta#e g,+#+r I
T %$u nNn ,h+ U h$ng
Gtr g,+#+r I
T %$u nNn ,h+ U
Gtd g,+#+r I
Tr+ng 4 #$ ,, gi tr( %$u
CD dE
>hi ,h8a t %$u ,! !ng
>hi t %$u ,! !ng Tng ,,h th% thu&, tDnh g,+#+r v$+ tag Gta#eI
17.2.Th/c h.h
[)n h=y Mng dEng ,, tag vN xWy d'ng !ng * xWy d'ng %&t danh s,hA vD dE
danh s,h #6p2 u ,Qu !ng ,4 thu&, tDnh +rder v$ %vi tn tr+ng danh
s,h #$ %&t siu #in k1t 1n (a ,ht th8 i.n tj ,Ja ng8Xi t8cng Mng2 _au khi
= xWy d'ng x+ng danh s,h v$ siu #in k1tA )n ,4 th* th% %$u s:, v$+ !ng
,h+ ~p2
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn
1K. g4r"-
Y+r% #$ %&t y1u tg khng th* thi1u * ,4 th* gia+ ti1p v6i %y ,hJ2 N4 89,
d5ng * nhRp d #i.uA #'a ,h?n ,, kh+!n %E,A222 Tr+ng Vu tr-nh #in k1t v6i
3ud _,riptA @+r%s ,h+ php )n #'a ,h?n thng tin tf ng8Xi d5ng v$ #8u tr n4
,h+ #Qn sj dEng sau2
Tr+ng $i h?, n$y ta sB ,,h t)+ @+r% Tng ,, tag cn ,Ja HTML2 >hi t)+
@+r%A ta ,Qn #8u o nht hai phQn 4 #$ tn nhRn d)ng (identi@ier" v$ gi tr( (va#ue"
,Ja @+r% 42 CD dE F Tr+ng h&p text +x v6i tn #$ YirstNa%eA ng8Xi sj dEng gw
v$+ C^_3A th- d #i.u gji 1n server #$ YirstNa%eC^_32
tag F GY+r% M`THipLL ^3TdiNLLI G222,, tag kh,222I GK@+r%I nT% gia hai
tag [ip
tr+ng 4 thu&, tDnh M`THip ,4 hai gi tr( #$ ]i_T v$ u`T2 N1u gi tr( #$ ]i_TA
n4 ,h+ php gji d #i.u tf %y 3#ient 1n _erver (th8Xng 89, sj dEng tr+ng
Y+r% nhRp #i.u"2 3Sn v6i u`T th- ,ht 89, sj dEng tr+ng Y+r% vn tin2 3Sn
^3TdiN ,ht ra v( trD ,Ja 3ud _,ript trn _erver sB 89, th', hi.n2 3, tag tr+ng
Y+r% th8Xng d5ng ,hJ y1u #$ GdN]TIA G_`L`3TIA Gi]TdiNI2
3h;ng ta sB #Qn #89t xt %&t sg Y+r% cn gi!n nh8 sau F
Text Blocks : T)+ ra v5ng vn !nA ,4 th* nhRp nhiNu dSng.
Text Boxes : l* nhRp v$+ %&t dSng cn2
Password Boxes : Y+r% n$y gigng Text [+xes nh8ng khng hi*n th( ,, ko
t'2
Radio Buttons : 3, n;t #'a ,h?n %&t.
Check Boxes : H&p 3he,k [+xes2
Menus : T)+ ra h&p Menu zy xugng2
Subit and Reset Buttons : 3, [utt+n * nhRn thng tin v$ khPi t)+ #)i
thng tin trn @+r%2
!idden "leents : 3, y1u tg zn2
#cti$e %a&es :T)+ M, !nh kD,h h+)t2
C'% Scri(t :Coon 'atewa) %nter*ace Scri(t.
+,.+. [$i h?,2
Text Blocks : <textarea rows= cols= na!e=" Text... <#textarea"
Tr+ng 4 ,+#s #$ ,hiNu r&ng ,Ja v5ng vn
!n tDnh the+ ko t'2 r+0s F ,hiNu ,a+ v5ng vn
!n tDnh the+ h$ng2 Na%e #$ thu&, tDnh * nhRn
d)ngA sj dEng tr+ng _,ript2 3, )n #8u o #$
Text [#+,ks khng :t Qu Tng tag dN]T2
Text Boxes : <in$ut ty$e=text na!e= !axlengt%= si&e=
'alue="
Tr+ng 4 sie ,ht ,hiNu d$i ,Ja Text
[+xes2 Max#engthA %in#ength ,ht sg ko
t' tgi a hay tgi thi*u ,4 th* nhRp v$+2
va#ue #$ gi tr( ki*u xWu 89, hi*n th(2
in h=y ,h+ i1t tn ,Ja )n F
Password Boxes : <in$ut ty$e=$assword !inlengt%= na!e=
si&e="
3, thu&, tDnh Nu gigng v6i Text
[+xes2 3ht kh, #$ khi )n nhRp d #i.u
th- ,, ko t' khng 89, hi*n th(2
in h=y ,h+ i1t %Rt %= F
(adio Buttons : <in$ut ty$e=radio na!e= c%ecked 'alue="L/a
ch".
va#ue ,hMa d #i.u sB gji 1n _erver khi
adi+ [utt+n ,he,ked2
#'a ,h?n U
#'a ,h?n e
)%eck Boxes : <in$ut ty$e=c%eckbox na!e= 'alue= c%ecked"L/a
ch".
H&p 3he,k [+xes ,4 ,, thu&, tDnh
th$nh phQn gigng nh8 adi+ [utt+n2
thu&, tDnh #'a ,h?n #$ phQn vn !n ghi
phDa sau n;t ,he,k +x2
#'a ,h?n U
#'a ,h?n e
Menus : <select si&e= !ulti$le"<o$tion selected
'alue="Text...<#o$tion" <#select"
3Zng gigng nh8 Text [#+,ksA Menu
khng :t Qu tf dN]T %$ #$ _`L`3T2
Thu&, tDnh %u#tip#e ,h+ php )n ,h?n
nhiNu %E,A n1u khng ,4 thu&, tDnh n$y
,4 %u#tip#e
th- n4 sB #$ %&t %enu zy xugng2 Mvi
#'a ,h?n ,Ja )n 89, % t! Tng ,,
tag i]TdiNA v$ )n ,4 th* ngQ% (nh #$
n4 89, ,h?n Tng thu&, tDnh se#e,ted2
khng ,4 %u#tip#e
*ub!it and (eset Buttons :
N;t _u%it #$ n;t * server ,4 th* #y thng tin tf ng8Xi sj dEng2 _au khi
nhRp #i.u s+ngA ng8Xi d5ng n v$+ _u%it th- %?i thng tin sB gji 1n server2
N1u ,4 thng tin sai Vuy (nh th- #Rp tM, server sB gji tr! #)i k{% v6i thng tin
+ #vi2
3Sn n;t eset sB khPi t)+ #)i t+$n & ,, gi tr( ,Ja @+r% Tng ,, gi tr( %<,
(nh2
Gdnput typeLsu%itL na%eLL
va#ueL_u%it [utt+nLI
Gdnput typeLresetL na%eLL
va#ueLeset [utt+nLI
Thu&, tDnh va#ue ,hMa phQn text hi*n th(
trn n;t %2 [)n ,Q% #8u o n;t eset
,ht khPi &ng #)i ,, gi tr( tr+ng ,5ng
%&t @+r% %$ thi2
_u%it [utt+n
eset [utt+n

+idden ,le!ents : <-n$ut ty$e=%idden na!e= 'alue="
Hidden `#e%ents 89, )n sj dEng * #8u tr thng tin = thu 89, tf @+r%
tr86, 4A d+ 4 n4 ,4 th* k1t h9p v6i d #i.u ,Ja @+r% hi.n t)i2
CD dE F n1u P @+r% tr86, an N ngh( ,h+ i1t tnA )n ,4 th* #8u #)i Pi %&t i1n
v$ th% n4 v$+ %&t @+r% %6i nh8 #$ %&t hidden e#e%entA sau 4 na%e sB 89,
#in k1t thng tin %6i thu 89, %$ khng ,Qn ng8Xi d5ng nhRp #)i tn nhiNu #Qn2
3, Hidden `#e%ents khng a+ giX hi.n trn %?i r+0ser ;ng v6i ,i tn ,Ja
n42
Tag n$y ,4 hai thu&, tDnhA thu&, tDnh na%e #$ tn ,Ja thng tin 89, #8u trA ,Sn
va#ue thng tin %$ !n thWn n4 89, #8u #)i2
.cti'e -!ages : <in$ut ty$e=i!age src= na!e="
Thu&, tDnh ,hMa tr+ng sr, ,ht ra 8Xng dqn t6i @i#e !nh trn server2
Thu&, tDnh na%e ,h+ %&t tn2 >hi ng8Xi d5ng ,#i,k v$+ !nh th- t)+ & x v$ y ,Ja
,hu&t hi.n h$nh sB 89, } sung v$+ tr8Xng na%e n$y v$ gji 1n server2
CD pE F ui! sj %y ,hJ %ugn i1t )n tf nci n$+ 1nA n4 ,h+ )n %&t !n n
th1 gi6i2 [)n ,ht vi1, ,#i,k #n !n nA gi! sj )n sinh ra P Ci.t na% th- ,ht vi.,
t-% ;ng n86, Ci.t na% v$ ,#i,k #n 42
)/- *cri$t : 0. )o!!on /ateway -nterface *cri$t1
L$ %&t ,h8cng tr-nh 89, kD,h h+)t Pi ng8Xi sJ dEng Tng ,,h ,#i,k #n
L2 N4 ,4 th* 89, vi1t Tng ngn ng %y tDnh nh8 3 hay ]as,a#A h+<,
89, vi1t Tng ]er# hay %&t ,h8cng tr-nh gia+ ti1p gia ng8Xi v$ %yA v$ ,4
kh! nng th', hi.n &, #Rp2
3ud _,ript 89, d5ng * kD,h h+)t %t ,h8cng tr-nh trn serverA #y thng tin
v$ sau 4 thng + #)i ,h+ ng8Xi sJ dEng2 CD dE )n ,4 th* d5ng 3ud _,ript *
g?i ,h8cng tr-nh ng$y trn server v$ thng + k1t Vu! trn trang 0e2
l* t)+ %&t #in k1t 1n 3ud _,ript )n h=y d5ng tag Ga
hre@LhttpFKK0002site2,+%K3ud-[dNKpathK,gis,riptIvn !n #in k1tGKaI2 Tr+ng 4
httpFKK000KsiteK,+% #$ tn ,Ja server ,hMa 3ud _,ript2 3ud-[dN #$ v( trD ,Ja 3ud
_,ript trn Nd server2 Kpath ,ht ra 8Xng dqn t6i ,gi-s,ript n1u khng t-% thy
tr+ng th8 %E, ,gi-in ,hDnh2
+)n %= n$y #$ s,ript t)+ ra %&t trang
HTMLA n4 #y ng$y trn server v$
,h{n v$+ trang HTML

)n h=y ,+py t+$n & +)n %= tr+ng
text #+,k n$y v$+ trang 0e #$ ,4
th* #y ng$y giX2
U2e2 Th', h$nh2
_au khi h?, #o thuy1t s+ngA )n h=y th', tRp * nh6 #)i ,, ki1n thM, = h?,2
[)n h=y t)+ %&t @+r% nhRp h? tnA nci PA %Rt khzu v$ %&t sg thng tin kh,
nh8 !ng d86i Wy2 Tr+ng 4 @+r% H? tnA nci P d5ng text +xA @+r% %Rt khzu
d5ng pass0+rd2 gi6i tDnh sB d5ng hai radi+ utt+n Na% v$ NA )n nh6 #$ ,ht
89, php ,h?n %&t tr+ng hai %$ thi2 Y+r% th$nh phg sB d5ng p+p-up %enuA
,4 ,, th$nh phg H$ N&iA H!i ]hSngA222 ,Zng ,ht 89, ,h?n %&t nci P duy nht2
3ugi ,5ng #$ text #+,k Thng tin th% * ng8Xi d5ng ghi ,h; th% n1u ,Qn2
_au khi nhRp s+ngA ,#i,k v$+ _u%it * gji thng tin 1n _erver2
3h;, )n th$nh ,ng2
3+pyright a y Ca#ue ^dder _ervi,e 3enter (C^_3"2 ^## ights eserved2
`-%ai#F i-t+dayavas,2vnn2vn
1N. Mult%"&/%! \ 'Xu b3n c2 l4!< hh+ )Mn t4 l6n...
3, )n thWn %1nA %&t tr+ng nhng y1u tg khng th* thi1u * #$% trang 0e
,Ja )n sinh &ng hcn v$ h+$n h!+ hcn 4 #$ W% thanh v$ h-nh !nh &ng2 Hi.n
nay ,, tr-nh duy.t 0e ,4 th* nhRn d)ng 89, rt nhiNu #+)i W% thanh v$ h-nh
!nh kh, nhau2 Nh8ng ,4 %&t vn N #$ nh8 )n = i1tA kD,h th86, ,Ja ,, @i#e
%edia rt #6n2 %&t @i#e W% thanh ,ht #89ng tgt ,4 thXi gian U giWy th- kD,h
th86, ,Ja n4 ,r e> v$ * t!i xugng ph!i %t Dt nht #$ %&t ph;t2 ]h!i ngni
,hX 1n %&t ph;t trn %y ,ht * ,g g:ng 89, nghe nh), th- Vu! #$ khng th*
,hp nhRn 89,A hcn na sau khi t!i xugng $i ht khng hay th- #)i ,$ng ',
%-nh hcn2 C- #o d+ nh8 vRy ,h;ng ti khuyn ,, )n nn #'a ,h?n ,, ki*u @i#e
thD,h h9pA ,4 kD,h th86, ,$ng nhy ,$ng tgt2 CD dE nh8 ,, @i#e W% thanh %idi
(2%id" hay @i#e ra (2ra" %$ hi.n nay 89, sj dEng ,hJ y1u trn %)ngA v$ ,, @i#e
vide+ avi (2avi"222
Tr+ng $i h?, n$y ,, )n sB h?, ,,h g?i %&t @i#e W% thanh v$ %&t h+)t ,!nh
vide+ v$+ trang 0e ,Ja ,, )n2
l8a W% thanh v$+ trang 0e ,Ja )n
e% Cide+ trn trang 0e
[$i h?,2
*ound.
l* sj dEng %&t @i#e nh), #$% W% thanh nNn ta d5ng tag Ggs+und
sr,Ls+und2extL L++pLLI2 Tag n$y khng ,4 tag k1t th;,2 Thu&, tDnh sr, ,ht ra
8Xng dqn 1n @i#e W% thanh s+und2ext trn server 3Sn thu&, tDnh L++p ,h+
php #<p #)i nhiNu #Qn n1u %ugnA gi tr( ,Ja n4 #$ %&t sg nguynA v$ n1u Tng -U
th- sB #<p v h)n2 Tag n$y 89, <t gia hai tag GheadI v$ GKheadI
Ngay sau khi 89, truy ,RpA trang 0e ,Ja )n sB ngay #Rp tM, L,hciL @i#e
s+und2ext2
[Wy giX ta sB t)+ %&t #in k1t * ,4 th* ,hci nh),2 ui! sj khi ta ,#i,k #n %&t
h-nh !nh hay %&t dSng ,h n$+ 4 th- Vu tr-nh ,hci nh), %6i :t Qu2 Ta sB sj
dEng tag sau F Ga hre@ sr,Ls+und2extLI text * #in k1t GKaI2 CD dE )n h=y 3#i,k
v$+ Wy * :t Qu nghe nh),2
[)n ,Zng ,4 th* thay phQn text #in k1t Tng %&t @i#e !nh n$+ 4 nhX ,h{n tag
Gi%g sr,LLI v$+ gia hai tag GaIv$ GKaI2 >hi ,#i,k v$+ !nh th- sB :t Qu ,hci
nh),2
2ideo.
T8cng t'A ta ,Zng d5ng tag Ga hre@ sr,Lvide+2extLI #in k1t GKaI2 C6i
vide+2ext #$ tn @i#e h-nh !nh trn serverA vD dE
LhttpFKK00020ind+0s2,+%KL+,a#Na%eK@#+0er2aviL ,h|ng h)n2
C6i ,,h sj dEng tag trnA )n ph!i nghe nh), Tng tr-nh nghe nh), ,Ja h.
iNu h$nh2 l* ,4 th* tD,h h9p v$ iNu khi*n Vu tr-nh nghe v$ xe% )n h=y sj
dEng tag F Ge%ed sr,L@i#e2extLI2 C6i tag n$yA )n ,4 th* nghe nh), t ,M #;,
n$+A %ugn #<p #)i h+<, iNu khi*n 1n +)n nh), n$+ tub )n2 ThRt #$ ti.n ph!i
khng )n2

l1n Wy )n ,4 th* #$% ,h+ trang 0e ,Ja )n sinh &ng hcn rni y2 3h;, )n
th$nh ,ng 2
3+pyright a y Ca#ue ^dder _ervi,e 3enter (C^_3"2 ^## ights eserved2
`-%ai#F i-t+dayavas,2vnn2vn
2@.1.!i h"c
Tr86, khi v$+ $i h?,A )n h=y * o kO %&t ,h;t trang n$yA khi )n s,r+## *
?, vn !n th- phQn <t h-nh !nh v$ tn $i h?, vqn Mng i%A khng ( di
,huy*n2
Trang /e 89, tr-nh $y the+ ki*u ,hia th$nh ,, phQn &, #Rp v6i nhau g?i #$
@ra%e2 [)n ,4 th* ,hia trang /e th$nh nhiNu phQn tub thD,hA vD dE F
>hi )n ,hia trang /e ,Ja %-nh ra a+ nhiu @ra%e th- )n ph!i t)+ ra y
nhiu @i#e HTML * %vi @ra%e hi*n th( %&t @i#e HTML2
Thng th8Xng +)n %= ,Ja %&t @i#e HTML 89, ,hia th$nh ,, @ra%e nh8 sau F
Ght%#I
GheadI
Gtit#eITiu N trang /e ,Ja )nGKtit#eI
GKheadI
G@ra%eset r+0sK,+#s LAA22ALI
G@ra%e na%e L@ra%ena%eUL sr, LLULI
G@ra%e na%e L@ra%ena%eeL sr, LLeLI
22222222
G@ra%e na%e L@ra%ena%enL sr, LLnLI
GK@ra%esetI
Gn+@ra%esI
_+rry \ Tr-nh duy.t ,Ja )n khng hv tr9 @ra%e
GKn+@ra%esI
GKht%#I
Tr+ng 4 tag G@ra%esetI ,4 t, dEng * ,ht ra ,,h ,hia @ra%e the+ ,hiNu ngang
hay ,hiNu d?,2 N1u )n (nh phWn ,hia the+ ,hiNu d?, th- d5ng tag G@ra%esetI
nh8 sau F
G@ra%eset ,+#s LAA22ALI
C6i AA22A #$ & r&ng ,Ja ,, @ra%eA )n ,4 th* ,h+ gi tr( #$ i*%A phQn
tr%222AvD dE
G@ra%eset ,+#s LUAkHLI
G@ra%eset ,+#s LUkAkLI
G@ra%eset ,+#s LUALI
tr+ng vD dE ,ugi ,5ng )n thy ,4 du 2 pu ,h+ i1t tr86, h1t ,hia ,h+ %&t
@ra%e & r&ng #$ UA phQn ,Sn #)i d$nh h1t ,h+ @ra%e ,Sn #)i2
3,h #$% t8cng t' gi v6i trang ,hia the+ ,hiNu ngang2
Tag G@ra%eI ,4 t, dEng (nh ngha %&t @ra%e2 Yra%e n$y sB ,4 tn #$ gi tr(
,Ja thu&, tDnh na%e LL v$ hi*n th( @i#e HTML ,4 tn #$ gi tr( ,Ja thu&, tDnh sr,
LL
Tag Gn+@ra%esI 222 GKn+@ra%esI d5ng * hi*n th( thng + khi tr-nh duy.t ,Ja
ng8Xi ?, /e khng hv tr9 @ra%eA vD dE
Gn+@ra%esI
_+rry \ Tr-nh duy.t ,Ja )n khng hv tr9 @ra%e
GKn+@ra%esI
CD dE khi %ugn ,hia %&t trang /e nh8 sau F
)n ph!i #$% nh8 sau F
Ght%#I
GheadI
Gtit#eI^ M+re 3+%p#ex Yra%ed ]ageGKtit#eI GKheadI
GY^M`_`T i/_LUeAI
GY^M` _3Lr+0U2ht%#LI
GY^M`_`T 3iL_LkAekI
GY^M`_`T i/_LsAhI
GY^M` _3Lr+0e,+#Ur+0U2ht%#LI GY^M` _3Lr+0e,+#Ur+0e2ht%#LI
GK@ra%esetI
GY^M`_`T i/_LUAI GY^M` _3Lr+0e,+#eUr+0U2ht%#LI
GY^M` _3Lr+0e,+#eUr+0e2ht%#LI GK@ra%esetI
GK@ra%esetI
GK@ra%esetI
GNiY^M`_I
This is 0hat s+%e+ne 0+u#d see 0h+ d+es n+t have a 0e
r+0ser that ,an disp#ay @ra%es
GKNiY^M`_I
GKht%#I
Thng th8XngA %&t trang /e 89, tr-nh $y nh8 sau F
tr+ng 4 gi! sj @ra%e #$% %enu ,4 tn #$ %enu v$ @ra%e hi*n th( thng tin ,4 tn
#$ disp#ay2 >hi ,#i,k #n ,, siu #in k1t P @ra%e %enu th- n&i dung ,Ja ,, trang
t8cng Mng hi.n #n @ra%e disp#ayA * #$% 89, iNu 4A tr+ng @i#e HTML ,Ja
@ra%e %enu )n 8a th% tag GaseI v$+ ngay sau tag G+dyI
222
G+dyI
Gase target Ldisp#ayLI
222
>hi )n khng %ugn hi*n th( +rder ,Ja @ra%eA )n th% thu&, tDnh +rder LL
v$ @ra%e+rder LL v$+ tag G@ra%esetI
GY^M`_`T i/_LhkAAUkL [ip` @ra%e+rderLLI
Tr+ng tr-nh duy.t )n khng %ugn thay }i kD,h th86, ,Ja @ra%eA )n th%
thu&, tDnh N+esie v$+ tr+ng tag G@ra%eI
GY^M` N^M`L%y@ixed@ra%eL +rder @ra%e+rderLUL _3L@ixed2ht%#L
Ni`_d`I
2@.2.Th/c h.h
[)n = h?, x+ng ,,h ,hia trang /e th$nh ,, @ra%eA Wy giX )n h=y t'
%-nh ,hia ,, trang 0e th$nh ,, @ra%e nh8 tr+ng ,, h-nh UAeAHAhAkAsA2
3, )n thWn %1nA Vua ,, $i h?,A ,, )n = n:% 89, kh vng nhng
khi1n thM, ,c !n nht vN HTML2 uiX Wy )n ,4 th* xWy d'ng ,h+ ring %-nh
%&t trang 0e ~p %:t ,h|ng k% g- ,, trang %$ )n thy trn %)ngA vD dE
nh8 xWy d'ng trang 0e vN gia -nh )n hay %&t nh4% )n { thWn thi1t ,Ja
)n ,h|ng h)n2
3h;, )n th$nh ,ng
[!n VuyNn 3ng ty ]ht tri*n ]hQn %N% (C^_3"
`-%ai#F i-t+dayavas,2vnn2vn

You might also like