HTML Vnn Căn bản

8/10/2019 HTML Vnn Cn bn

1/66

Phn I. K nng c bn

1.1 HTML l g?

HTML (Hyper Text Markup Language - Ngn ng nh du siu vn !n" #$ %&ts' nh d)ng * + ,h+ tr nh duy.t /e (/e r+0ser" i1t ,,h * hi*n th%&t trang /e 2

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+


2/66

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 Gh I v$ +)n vn !n #$ tag GKh I2 Tr+ng tag

GKh I ta thy ,4 du K A du K n % tr+ng U tag + hi.u ,h+ tr nh duy.t i1t #$hi.u ng ,Ja tag 4 = k1t th;,2

'h( )*+ )%,c - /0ng "#t t!g HTML nh( -!u

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 Gh I v$ GH I #$ nh8 nhau2

1.2.2. Cu trc ca mt file HTML.

Yi#e HTML a+ giX ,Zng :t Qu ng th7 Ght%#I v$ k1t th;, ng th7 GKht%#I23


3/66

GK +dyI

GKht%#I2

[!n Vuy n 3ng ty ]ht tri*n ]hQn % % (C^_3"`-%ai#F i-t+day vas,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 #8utr P d)ng ^_3 2

2 [)n h=y nhRp nhng dSng vn !n sau

Ght%#I

GheadI

Gtit#eI3hWn trXi tri th , - nternet t+day GKtit#eI

GKheadI

G +dyI

3h$+ %fng )n = tha% gia ,huyn %E, 3hWn trXi tri th , ,Ja t)p ,hD 3ngngh. Thng tin nternet T+day2 Tr+ng phQn n$y )n sB 89, h?, nhng ki1nth , ,c !n v HTMLA ,ng ,E * t)+ ra ,, trang /e 2 _au khi = h?, x+ng vHTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn !nA h nh !nhAW% thanh222

GK +dyI
mailto:[email protected]:[email protected]:[email protected]


4/66

GKht%#I

2 L8u @i#e v6i phQn %P r&ng #$ ht%2 CD dE [aiU2ht%2

L(u 7 F [)n nn t)+ %&t Y+#der ring * ,h a ,, tRp tin %$ )n sB t)+ ra tr+ng

su t thXi gian h?, HTML22 >hPi &ng ` h+


5/66

>hi tr nh $y %&t trang /e A ,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 ,hWnGiIlWy #$ tag nghing GKiI y l tag nghing GttIlWy #$ tag ,h nh %yGKttI lWy #$ tag ,h nh %y

G IlWy #$ tag R% GK I ' l tag *+mGe%IlWy #$ tag GKe%I y l tag Strong

Gstr+ngIlWy #$ tag str+ngGKstr+ngI ' l tag ,tr- gGstrikeIlWy #$ tag str+ngGKstrikeI lWy #$ tag strike#ine

[)n ,4 th* k1t h9p ,, tag n$y v6i nhauA %imn #$ ,h;ng 89, # ng v$+ nhau %&t,,h ,hDnh x,2 CD dEF

G I GiI 2222 GKiI GK I

Tag in nghing ph!i n % tr+ng tag in R%2

Hcn na )n ,4 th* p dEng ,, tag v6i tiu

Gh I GiI 2222 GKiI Gh I

.2.Th/c h h

p dEng v$+ @i#e HTML ,Ja )n2U2 T)+ %&t @i#e HTML %6i

2 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

Gh IG IGiI3h; o khi t)+ @i#e HTMLGKiIGK IGKh I

N1u )n d5ng ,, ,h8cng tr nh s+)n th!+ vn !nG IGuI kh, N+te]ad ,Ja/ind+0s GKuIGK Ith )n ph!i nh6 #8u k1t Vu! P d)ng vn !n trcn (^_3 "

2 L8u ,ng vi., ,Ja )n2

2 5ng tr nh duy.t %P v$ s+ snh v6i vD dE %qu2


6/66


>. @u "Ac t%6u 5B

0.1. !i h"c

>hi tr nh $y %&t trang /e A i khi )n ph!i ,Qn 1n ,, tiu the+ ,, kD,h, A phng ,h kh, nhau2 HTML ,4 ,, tag * th', hi.n vi., n$y2

l* t)+ %&t tiu ,h;ng ta d5ng

GhxI Tn tiu GhxI

Tr+ng 4 x #$ %&t s ,4 gi tr tf U 1n ,h kD,h , tiu 2 _au Wy #$ vD dE ,h+,, , ,Ja tiu 2

Ti u * c3 1 4566 H1 c3 7 668


7/66

Ti u * c3 2Ti u * c3

Ti u * c3 0

Ti u * c3 9

Ti u * c3 7.

0.2.Th/c h h

Th6" c@c t%6u 5B )4 tr!ng &b c ! b3n.

U2 MP #)i @i#e HTML %$ )n = t)+ ra P $i h?, tr86, ng tr nh s+)n th!+ vn!n %$ )n = d5ng * t)+ ra n42

2 Th% +)n sau v$+ @i#e HTML2 [)n ,Qn #8u o +)n th% v$+ ph!i n % giaG +dyI v$ GK +dyI

GhUI 6i thi.u ,hungGKhUI

v$+ tr86, +)n 3h$+ %fng )n = tha% gia ,huyn %E, 3hWn trXi tri th , ,Jat)p ,hD 3ng ngh. Thng tin nternet T+day2 Tr+ng phQn n$y )n sB 89, h?,nhng ki1n th , ,c !n v HTMLA ,ng ,E * t)+ ra ,, trang /e 2 _au khi =h?, x+ng v HTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn

!nA h nh !nhA W% thanh222

2 L8u ,ng vi., )n vfa #$%2

2 5ng tr nh duy.t /e * %P @i#e HTML )n vfa t)+ v$ s+ snh v6i vD dE %quAn1u )n thy kh, )n ,4 th* ph!i xe% #)i nhng g % nh = t)+ tr+ng @i#e HTML2

2 3hia vn !n th$nh nhi u +)n


8/66

Tr86, h1t )n #)i %P @i#e HTML %$ )n = t)+ tf ,, $i h?, tr86, ng tr nhs+)n th!+ vn !nA thay v * vn !n nh8 ,ZA Wy giX P ,u i % i dSng )n ,4th* 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 th , ,Ja t)p ,hD 3ng

ngh. Thng tin nternet T+day2 Tr+ng phQn n$y )n sB 89, h?, nhng ki1nth , ,c !n v HTMLA ,ng ,E * t)+ ra ,, trang /e 2 _au khi = h?, x+ng vHTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn !nA h nh !nhAW% thanh222

L8u ,ng vi., )n vfa #$% v$ %P n4 trn tr nh duy.t ,Ja )n2 >hi 4 )n sBtrng thy k1t Vu! trn tr nh duy.t nh8 sau F

[)n ,!% thy ,4 i u g khng ;ng ph!i khng [Pi v HTML Vua du hi.uxu ng dSng khi )n gw `nter v$ Vua ,, dSng tr ng nn )n thy +)n vn

!n %$ )n vfa nhRp d5 ,4 `nter * xu ng dSng nh8ng vqn #i n v6i nhau2

l* ,hia +)n HTML d5ng tag GpI

3Zng #8u o r ng tag GhxI g:n #i n v6i s' ,hia +)n nn )n khng ,Qn ph!i


9/66

3h$+ %fng )n = tha% gia ,huyn %E, 3hWn trXi tri th , ,Ja t)p ,hD 3ngngh. Thng tin nternet T+day2 Tr+ng phQn n$y )n sB 89, h?, nhng ki1nth , ,c !n v HTMLA ,ng ,E * t)+ ra ,, trang /e 2 _au khi = h?, x+ng vHTML )n ,4 th* t)+ ra nhng trang /e Qy n t89ng v6i vn !nA h nh !nhAW% thanh222

GpI

T)p ,hD nternet T+day #$ %&t t)p ,hD i.n tj ,huyn v 3ng ngh. thng tin23h;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

2 L8u #)i ,ng vi., ,Ja )n2

2 5ng 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 /e 2

G rI lzy vn !n xu ng %&t dSng %6iA tag n$y kh, tag GpI P ,h n4 khng

,h{n th% v$+ trang ,Ja )n %&t dSng tr ng nh8 tag GpI2 [)n ,4 th* sj dEngtag 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?, CNNUG rI


10/66

3Wu #), & Cn h+ CNN G rI

T)p ,hD nternet T+dayG rI

GhrI

Th k1t Vu! nh8 sau F


G. Pr&$4r"!tl&/ t& t

9.1.!i h"c

]hQn n$y tr nh $y v ,,h hi*n th ,, +)n vn tr+ng 4 ,4 ,! ,, kh+!ngtr:ng v$ du xu ng dSng2

Nh8 )n = i1t tr+ng ,, phQn tr86,A tr nh duy.t Vua ,, dSng tr:ngA duhi.u xu ng dSng khi ta s+)n th!+2 Tuy nhin )n vqn ,4 th* hi*n th 89, vn

!n nh8 #;, )n nhRp v$+ ng ,,h sj dEng tag GpreI

CD dE


11/66

GpreI

>hi )n %u n tr nh duy.t /e hi*n th ;ng nh8 )n s+)n th!+A )n nh6 d5ngtag GpreI

[)n ,4 th* xu ng dSng2[)n ,4 th* d5ng du ,,h th+!i %i2222

GKpreI

_B 89, hi*n th nh8 sauF


. Th6" "#t J%9u trnh b+ ch4 tr!ng &b c ! b3n

7.1.!i h"c


12/66

l* #$% ,h+ %&t kh i vn !n n}i hcnA vD dE %&t +)n trD,h dqnA %&t #Xi khuyn222v$ #$% ,h+ trang /e ,Ja )n tr nh $y 89, ~p hcnA ,h;ng ta sj dEng tagG #+,kVu+teI

l+)n vn !n n % tr+ng ,

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 )nh=y d5ng tag #t #+,kVu+te gt

G #+,kVu+teI

GhrI

Tr nh $y +)n vn !n ng 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


13/66

C6i nhng ki1n th , = 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


. /0ng c@c J7 t 5 c b%,t

:.1.!i h"c

li khi tr+ng trang /e ,Ja )n ,4 ,, ko t'


14/66

Tr+ng trang /e ,Ja )n nhi u #;, ph!i hi*n th ,, ko t' nh8 du #6n hcn (I"h+


15/66

:.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'


16/66

3u i ,5ng ,h;ng ti 8a ra %&t !ng ,, ko t'A )n h=y 3#i,k v$+ Wy * xe%!ng2


N. O(! hnh nh )4 "#t tr!ng &b

;.1.!i h"c

_au khi h?, ,, $i tr86, ,h:, )n vqn ,Sn th:, %:,A sa+ trang /e ,Ja % nhxu t.A khng gi ng ,, trang trn nternet %$ )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*


17/66

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 ng nh8 sau2

U2 a#ign t+p

2 a#ign %idd#e

2 a#ign +tt+%

CD dE


18/66

Ng+$i ra thu&, tDnh n$y ,Sn ,4 %&t s gi tr kh, nh8FTextTop A AbsMiddle A AbsBottom v$ Baseline 2 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 sh nh !nh * #$% vD dE

U T)+ %&t @i#e HTML %6i v$ sj dEng ,, tag * th% !nh v$+ tr+ng trang /e

2Thj th% ,, thu&, tDnh a#ign v$+ tr+ng tag i%g v$ s+ snh v6i k1t Vu! ,Ja$i h?,

;. .Th m mt h ca tag 4img...8

1. Thu#c t nh !lt Q R R.

>hi trang /e ,Ja )n 89, xe% ng 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 ,h+ phpthay th1 v$+ v trD h nh !nh %&t ,hu i vn !n % t! n42

CD dE

Gi%g sr, 22K]i,turesK +0#+ad2pg a#ign t+p a#t +0n#+ad _+@t0are I


19/66

3E% tf +0n#+ad _+@t0are = thay th1 ,h+ h nh !nh2

2. Thu#c t nh 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 ng pixe#" v$+ tag Gi%gI2 3,h sj dEng ,, thu&, tDnh n$y #$F

Gi%g sr, 0idth xA height yI

xAy #$ ,hi u r&ng v$ ,hi u ,a+ ,Ja !nh2

8. Thu#c t nh t34 )Sng u!nh nh.

Thu&, tDnh n$y #$% ,h+ kh+!ng ,,h gia , !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`FGi%g sr, hspa,e xA vspa,e yI

x #$ kh+!ng ,,h v5ng tr ng P hai %


20/66

U. Cn chVnh lB

?.1.!i h"c

U.1.!. WF XF )n bn )4 g%Y! tr!ng

Tr+ng ,, $i h?, tr86,A )n thy r ng trang /e ,Ja )n ,h 89, ,n #n triA v$ )n %u n tr nh $y trang /e ,Ja % nh ~p hcn ng ,,h s:p

x1p ,, +)n vn !n v$+ gia trangA HTML ,4 nhi u ,,h gi;p )n th', hi.ni u n$y2

3,h th nhtF [)n


21/66

U.1.b. WF XF t(ng 5E% g%Y! )n bn ) hnh nh

>hi %u n ,4 vn !n phJ xung Vuanh h nh !nhA )n ,h vi., th% thu&, tDnha#ign v$+ tag Gi%gI

CD dEFGi%g sr, @i#ena%e a#ign right I

sB ,h+ k1t Vu!F

s+ v6i khng ,4 thu&, tDnh a#ignF


22/66

>hi vn !n h+hi ,h8a ,4 tag G r ,#ear I

>hi ,4 th% tag G r ,#ear a##I


23/66

>hi ,Qn tr nh $y vn !n phJ Vuanh h nh !nh v6i %&t kh+!ng ,,h nht nh tad5ng 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, anhU2pg a#ign #e@t vspa,e U hspa,e I

_+ v6i khi khng ,4 ,, thu&, tDnh vspa,e v$ hspa,e


24/66

U.1.c. ChVnh lB ) -WF XF )n bn

Ng+$i ,, ,,h s:p x1p vn !n %$ )n = i1tA HTML ,Sn ,h+ ,h;ng ta th%%&t tag ,n ,h nh vn !n naA 4 #$ GdivI 222 GKdivI2 C5ng vn !n ,h u !nhh8Png ,Ja tag n$y d'a v$+ thu&, tDnh a#ign2

Gdiv a#ign #e@tI 222 GKdivI

Gdiv a#ign rightI 222 GKdivI


25/66

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 ,JaCNN ,h|ng h)nA tr+ng 4 ,4 sj dEng ,, h nh !nh %inh h+) ,h+ tin2 u ,Qu sjdEng thu&, tDnh vspa,e v$ hspa,e * ,n ,h nh kh+!ng ,,h gia vn !n v$h nh !nh ,h+ ~pA sj dEng tagGdivI * ,anh # ,h+ +)n vn !n2


1Z. T34 c@c -%6u l%6n JXt


26/66

li u th', s' #$% ,h+ /e n}i tr&i #$ kh! nng t)+ ra ,, % i #in k1t 1n ,,thng tin #in Vuan2 Nhng thng tin n$y ,4 th* n % tr+ng ,hDnh trang /e hayn % P ,, trang /e kh, a+ g % h nh !nhA W% thanhA +)n phi%222

[email protected]. Li A$t tBi mt file c c D.

[Wy giX )n :t Qu t)+ %&t #in k1t tf trang /e ,Ja )n 1n %&t trang /eth hai2 Lin k1t n$y 89, g?i #$ ,E, & Pi v trang /e th hai ,Zng ,5ng n %trn %&t %y v6i trang /e Qu2

l* cn gi!n tr86, h1t )n t)+ %&t @i#e HTML th hai v$ 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%


27/66

[)n ,Zng ,4 th* #in k1t t6i %&t h nh !nh ng ,,h thay tn @i#ena%e2ht% ng%&t @i#e !nh2 CD dEF

Ga hre@ #+g+2gi@ I Text GKaI

T6i Wy ,h:, )n #)i ,4 th:, %:,A %u n #in k1t t6i th8 %E, kh, h+


28/66


29/66

Gu#I

G#iIGa hre@ httpFKK0002hut2edu2vn ITr8Xng l)i h?, [,h kh+a H$ n&iGKaI

G#iIGa hre@ httpFKK0002vnn2vnKi-t+day IT)p ,hD 3ng ngh. Thng tin nternet

T+dayGKaIG#iIGa hre@ %ai#t+Fhung nd v+#2vnn2vn I ji th8 ,h+ TrQn Ci.t H5ngGKaI

GKu#I

2 L8u ,ng vi., ,Ja )nA sau 4 %P tr nh duy.t v$ s+ snh v6i vD dE2 [)n ,4th* ki% tra ,, siu #in k1t ng ,,h di ,hu&t v$+ v5ng vn !n siu #in k1tv$ xe% thng + P thanh tr)ng thi ,Ja tr nh duy.tA thanh tr)ng thi sB hi*n thL %$ )n sB #in k1t t6i2

1@. . Li A$t tBi cKc NhO tr- g cP g mt tra g

HTML khng nhng ,h+ )n t)+ #in k1t 1n ,, trang /e kh, n % P ,5ng%y tDnh v6i trang /e ,Ja )n h+


30/66

Ga hre@ v+#U2ht%na%eI Text GKaI

Ga hre@ Lna%eI Text GKaI

CD dE F3#i,k v$+ Wy * v Qu trang

[email protected]. TE- cKc hi 4 )n sj dEng ,, Tag nh8 sau

Ga hre@ @i#e2ht% I Gi%g ser graph2pg IGKaI[)n #8u o #$ tag Gi%g22I n % 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 7 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 s %~+ sauF

U2 l* phSng ng8Xi ?, tt ,h1 & hi*n th h nh !nh ,Ja tr nh duy.tA )n nn

th% thu&, tDnh a#t 222 v$+ tag Gi%g222I * ng8Xi ?, dm nh h86ng2 >hi ,Qn gi6i thi.u %&t h nh !nh #6nA )n nn t)+ %&t h nh !nh thu nh ,Ja n4

v$ 8a v$+ trang /e #$% siu #in k1t t6i !nh #6nA nh8 th1 %t thXi giand+0n#+ad trang /e ,Ja )nA vD dE )n h=y 3#i,k ,hu&t v$+ !nh sau F

Th c hnh

[Wy giX )n h=y t)+ %&t @i#e HTML %$ phQn Qu 89, tr nh $y the+ ki*u %E,#E,A % i %E, #in k1t t6i phQn n&i dung t8cng ng tr+ng ,5ng vn !nA P ,u i% i phQn n&i dung ,4 %&t !nh #$% siu #in k1t * + Vuay trP #)i Qu t$i #i.u2Trng gi ng nh8 sau


31/66


11. Th6" 5:! chV< l%6n JXt [\"!%l )4 tr!ng &b c ! b3n

11.1. !i h"c

Nh8 )n vqn th8Xng thy tr+ng ,, trang /e trn nternetA phQn ,u i % i trangth8Xng ,4 ,, thng tin v trang /e A ,h|ng h)n nh8F

Tiu hay ,hJ ,Ja trang hi.n thXi

Ng$y ,Rp nhRt gQn Wy nht


32/66

[!n Vuy n

Tn v$ `-%ai# ,Ja t, gi! ,Ja trang /e

222

]hQn n$y g?i #$ @++ter ,Ja trang /e 2 l* th% @++ter v$+ trang /e A 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 n % tr+ng tag GaddressI 89, in ng ki*u ,h nghingA tuynhin )n ,4 th* thay }i ,,h hi*n th ,Ja ,h;ng ng ,,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 /e A )n th%+)n sau v$+ ,u i phQn +dy

GaddressI

GhrI

Gp a#ign ,enter I

3huyn %E, 3hWn trXi tri th , - T)p ,hD nternet T+dayG rI

3+pyright y C^_3G rI

l a ,h F Tri.u Ci.t C8cng - H$ n&iG rI` %ai# F Ga hre@ %ai#t+Fi-t+day vas,2vnn2vn Ii-t+day vas,2vnn2vnG rIGKaI

M?i o ki1n v & s,h HTML xin gji v F TrQn Ci.t H5ngG rI

` %ai# FGa hre@ %ai#t+Fhung nd v+#2vnn2vnIhung nd v+#2vnn2vnGKaI


33/66

GKpI

GKaddressI

2L8u ,ng vi., ,Ja )n v$ s+ snh v6i vD dE %quF


Phn 2. '=ng c!4

12. T34 c@c /!nh -@ch

12.1. !i h"c

anh s,h 89, d5ng * tr nh $y thng tin th$nh %&t d)ng dm ?, hcn2 3h|ngh)n * t)+ ra ,, !ng ,h %E,A n&i dung ,Ja %&t d=y ,, t$i #i.u hay ,,,h8cng2


34/66

HTML ,4 hai ki*u danh s,hA danh s,h ,4 th t' (+rdered" v$ danh s,h khng,4 th t' (un+rder"2

]!nh -@ch Jh^ng c thA t .

anh s,h khng ,4 th t' ,4 ,, %E, :t Qu ng ,, ut##et h+


35/66

]!nh -@ch c thA t

anh s,h ,4 th t' #$ danh s,h %$ % i %E, ,Ja danh s,h 89, nh s Ath8Xng :t Qu tf U 2 l* t)+ ra danh s,h ,4 th t' ta d5ng ,, tag sauF

G+#I

G#iI3h %E, th nht

222

G#iI3h %E, ,u i ,5ng

anh s,h ,4 th t' ,h kh, danh s,h khng ,4 th t' P ,h thay tag Gu#Ing tag G+#I2

CD dE F N1u tr+ng phQn +dy ,Ja @i#e HTML ,4 +)n

Gh I3, 86, ,huzn * h?, HTMLGKh I

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 nternet `xp#+rer h+


36/66

GK+#I

]!nh -@ch 5:nh ngh_! ` definition lists a

anh s,h nh ngha khng ,4 ,, ,h %E, Qu dSng2 _au khi k1t th;, tag GdtIAn4 t' &ng xu ng 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


37/66

Gh ICD dE v danh s,h nh nghaGh I

Gd#I

GdtIl nh ngha UGKdtI

GddIgi!i thD,h nh ngha U2GKddI

GdtIl nh ngha GKdtI

GddIgi!i thD,h nh ngha GKddI

GdtIl nh ngha GKdtI

GddIgi!i thD,h nh ngha 2GKddI

Tr+ng trang /e * t)+ ra ,, %E, thng tin ,4 ,u tr;, #+gi, hcn )n ,4 th*# ng ,, danh s,h v6i nhau2

CD dE v tr&n danh s,h

Gh ICD dE v tr&n danh s,hGKh I

G+#I

G#iI 3h %E, U Gu#I

G#iI 3h %E, ,+n U

G+#I

G#iI 3h %E, ,+n U

G#iI 3h %E, ,+n

GK+#I

G#iI 3h %E, ,+n

GKu#I

G#iI 3h %E, ,+n


38/66

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 ng ,, tagHTML nh8 sau F

Gh IME, #E,GKh I

Gu#I

G#iI3h8cng %&t

G+#I

G#iI i6i thi.u ,hung

G#iINhng ki1n th , v #Sng v HTML

GK+#I

G#iI3h8cng hai

G+#I


39/66

G#iI3, tag thng dEng

Gu#I

G#iITag nh d)ng ki u ,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

2 L8u ,ng vi., ,Ja )n2 MP trn tr nh duy.t v$ s+ snh v6i vD dE %qu


40/66


18. Tr!ng tr ch4 )n bn

1 .1.!i h"c

ua ,, $i h?, tr86, )n = i1t ,,h th% %$u s:, ,h+ n n v$ vn !n thngVua vi., thi1t #Rp ,, thu&, tDnh ,h+ tag G +dyI2 Tr+ng $i n$y )n sB h?, ,,hthay }i %$u s:,A kD,h th86,A @+nt ,h ,Ja phQn vn !n tr+ng trang /e ,Ja

)n2

18.1.!.C $4nt

>hi %u n thay }i , @+nt th d5ng

G@+nt sie I 222 GK@+ntI

Tr+ng 4 #$ , @+nt ,4 gi tr tf U (nh nht" 1n (#6n nht"

CD dEF

3 @+nt U

3 @+nt

3 @+nt

222

3 @+nt Ng+$i ra HTML ,Sn ,h+ ,h;ng ta %&t ,,h kh, * th', hi.n vi., thay }i ,@+ntA thay }i t8cng i


41/66

G@+nt sie I 222 GK@+ntI

G@+nt sie - I 222 GK@+ntI

Tr+ng 4 A - #$ & d ,h ,huy*n s+ v6i , @+nt hi.n t)i2 3h;ng th8Xng 89,

d5ng ,5ng v6i tagG ase@+nt sie I

F 3 @+nt %u n


42/66

18.1.c.H%9n th: chV -E tr6n ) chV -E /( %

>hi ,Qn ph!i tr nh $y ,h s trn hay ,h s d86iA nh8 ,, ,ng th , h+ h?,,h|ng h)n ,h;ng ta sj dEng ,, tag GsupI 222 GKsupI ,h+ ,h s trn v$Gsu I 222 GKsu I ,h+ ,h s d86i2

CD dEF

l* ,4 NH A ta ph!i vi1t

NHGsu I GKsu I

l* ,4 x ta ph!i vi1txGsupI GKsupI


43/66

1 .2. Th/c h h

[)n thWn %1nA )n = h?, 89, kh nhi u ki1n th , v #Sng v HTMLA Wy giX)n h=y p dEng nhng ki1n th , = h?, * t)+ ,h+ % nh %&t trang /e v6i

%$n h nh n n ,4 %$u s:,A ,, #+)i @+nt ,h kh, nhauA ,, h nh !nh v$ siu #in

k1t222>hi = #$% nhi u trang /e )n sB ,4 nhi u 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


1>. Th6" "u -Wc ch4 tr!ng &b c ! b3n

10.1.!i h"c

Tf khi h?, $i Qu tin 1n Wy giXA ,h:, nhi u khi )n th:, %:,F T)i sa+

trang /e ,Ja % nh #)i ,h ,4 hai %$u en v$ tr:ngA tr+ng khi ,, trang /e% nh nh n thy u 89, trang trD rt ~p 2 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 /e A )n ,4 th* sj dEng %$u * trang trD ,h+ vn!n v$ n n2 M i %$u 89, x, nh Pi & a ed- reen-[#ue ( ["A ,, gi

tr ,Ja A A [ tf 1n th* hi.n ,8Xng & ,Ja n42 CD dE khi ,! a ,4 gi trnh nht ( 0 A 0 A [" th sB ,h+ ta %$u en v$ khi ,! a ,4 gi tr #6n nht( A A [ " th ,h+ ta %$u tr:ng2 [& a [ v6i ,, gi tr kh,nhau sB ,h+ ta ,, %$u kh, nhau2Tr+ng HTMLA khi %u n sj dEng %&t %$u n$+ 4A thay v d5ng ,, gi tr ,Ja A

A [ P h. thRp phWnA )n ph!i i*u dimn ,h;ng P d)ng h. U 2

CD dEF

M$u tr:ng ng v6i A A [ 89, i*u dimn #$ YYYYYY2


44/66


45/66

_au Wy #$ %&t s %$u ,c !n v$ ko hi.u t8cng ng

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 ame C-l-r ame

xx oo xx aqua xx oo xx black

xx oo xx blue xx oo xx fuchsia

xx oo xx gray xx oo xx green


46/66

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 tr nBn bdng hnh nh

N1u )n %u n %$u n n ,Ja trang /e ,Ja )n ~p hcnA )n ,4 th* d5ng %&t

@i#e !nh nh * trang trD ,h+ n n2 >hi 4A HTML sB t)+ ,, !n sa+ #in tE, ,Ja@i#e !nh * phJ h1t n n ,Ja trang /e 2

l* d5ng h nh !nh #$% n n ,h+ trang /e A ta d5ng thu&, tDnh a,kgr+und tr+ngtag G +dyI

G +dy a,kgr+und @i#ena%e I

Tr+ng 4 @i#ena%e #$ tn @i#e !nh %$ )n d5ng #$% n n2

10.2.Th/c h h

U2T)+ %&t @i#e HTML v$ ,huzn %&t h nh !nh * #$% n nA vD dE !nh sau ,4 tn#$ stra0 2pg

Th% v$+ tag +dy thu&, tDnh a,kgr+und nh8 sauF

G +dy a,kgr+und stra0 2pg I

2L8u ,ng vi., ,Ja )nA %P trn tr nh duy.t v$ s+ snh v6i vD dE %quF


47/66


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 ngh nh !nh2 [$i n$y sB ,ung ,p ,h+ )n t)+ ra nhi u siu #in k1t tf ,5ng %&th nh !nh ng ,,h ,hia h nh !nh 4 th$nh ,, v5ngA % i v5ng #in k1t t6i %&ttrang /e kh, nhau2 Tr86, h1t %Xi )n xe% vD dE sau F

- C6i h nh !nh nh8 sau F


48/66

- _au khi 89, kh+anh v5ng v$ t)+ ,, siu #in k1tA Wy giXA !nh trn sB 89,#in k1t t6i nhi u trang /e kh,A )n h=y thj ,#i,k v$+ ,, tn t8cng ng trn!nh v$ xe% k1t Vu!2

l* t)+ ra 89, %&t h nh !nh v6i nhi u #in k1tA t6i nhi u trang /e kh, nhauA

HTML ,ung ,Wp ,h+ ,h;ng ta tag G%apIA ,,h #$% nh8 sau FU23huzn %&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 /e A tr+ng tag Gi%gI )n sj dEngthu&, tDnh use%ap nh8 sau F

Gi%g sr, #ienket2pg use%ap %ap na%e I

tr+ng 4 %ap na%e #$ phQn %$ )n nh ngha ,, v5ng ,Ja !nh * tf 4 t)+,, siu #in k1t2

2l nh ngha ,, v5ng * t)+ siu #in k1t F l* t)+ ,, v5ng ta sj dEng tagG%apI nh8 sau F

G%ap na%e %ap na%e I

Garea shape re,t ,++rds xUAyUAx Ay hre@ L I

Garea shape re,t ,++rds x Ay Ax Ay hre@ L I

2222

GK%apITr+ng 4 tag GareaI nh ngha %&t v5ng ,4 h nh #$ thu&, gi tr ,Ja thu&, tDnhshape A ,4 t+) & #$ gi tr ,Ja thu&, tDnh ,++rds A tr+ng vD dE trn v5ngt)+ siu #in k1t #$ v5ng h nh ,h nhRt (re,t" ,4 t+) & g4, trn n tri #$ xUAyUt+) & g4, d86i n ph!i #$ x Ay v$ #in k1t t6i trang /e #$ gi tr ,Ja thu&,tDnh hre@

l+)n %= HTML ,Ja vD dE trn nh8 sau F

G%ap na%e Y]Map I

Garea hre@ httpFKK0002hut2edu2vn shape re,t ,++rds A UA U A IGarea hre@ httpFKK0002vnn2vn shape re,t ,++rds U A A A IGarea hre@ httpFKK0002t#net2,+%2vn shape re,t ,++rds A A U A UGarea hre@ httpFKK0002netna%2vn shape re,t ,++rds A UA U A U IGarea hre@ httpFKK0002@pt2vn shape re,t ,++rds UA U A U A U IGK%apIGi%g +rder sr, %ageK#ienket2pg use%ap Y]Map0idth U height U I


49/66

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;, )nth$nh ,ng2


1 . eng

17.1. !i h"c

Ci., tr nh $y trang /e the+ d)ng !ng sB #$% ,h+ trang /e ,Ja )n ,huynnghi.p hcn2 C6i d)ng !ng )n ,4 th* ,hia trang /e th$nh nhi u phQnA )n ,4th* p dEng ,, ki1n th , = 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 ti1pthe+ xWy d'ng ,, ,Ja h$ng Qu tinA sau 4 ,huy*n xu ng h$ng th haiA xWyd'ng ,, phQn tj ,Ja h$ng th 222

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

1 .1.!. 'hYng t!g c bn c ! bng

l* t % hi*u v ,, tag ,c !n ,Ja !ngA tr86, h1t ta xt vD dE sau2

Gta #e +rder UI

GtrI

GtdI H$ng U ,&t U GKtdI


50/66

GtdI H$ng U ,&t GKtdI

GtdI H$ng U ,&t GKtdI

GKtrI

GtrI

GtdI H$ng ,&t U GKtdI

GtdI H$ng ,&t GKtdI

GtdI H$ng ,&t GKtdI

GKtrI

GKta #eI

Tr+ng tag Gta #eI ta thy thu&, tDnh +rder ,4 gi tr #$ UA i u n$y ngha #$ vB U8Xng vi n Vuanh !ng v6i & d$y #$ U i*%2

M i h$ng 89, x, nh Pi GtrI v$ GKtrI vi1t t:t ,Ja ta #e r+02

M i 89, nh ngha Pi GtdI v$ GKtdI vi1t t:t ,Ja ta #e data2

l* ,n ,h nh # tr+ng % i A )n th% ,, thu&, tDnh sau v$+ tag GtdI2

3h nh # the+ ,hi u ngang

Gtd a#ign #e@tI s:p x1p v n tri

Gtd a#ign rightI s:p x1p v n ph!i

Gtd a#ign ,enterI s:p x1p v$+ gia


51/66

1 .1.b. C@c hng ) c#t

[!ng %$ )n t)+ P trn %6i ,h #$ !ng cn gi!n v6i a h$ng v$ a ,&t unhau2

[)n h=y ,h; o ,, !ng sau2

[!ng U

[!ng


52/66

[!ng

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 th ,Ja h$ng U ra r&ng ng hai ,&t nh th8Xng ta


53/66

1 .1./. Th6" 5u 5B )4 bng `c!Ft%4na

Ngay sau tag Gta #eIA )n gw v$+ tag G,atpi+nI t'a ,Ja !ngA v$ k1t th;,ng tag 4ng GK,apti+nI

Gta #e IG,apti+n a#ign ,enter va#ign t+p IGuIT'a ,Ja !ngGKuI GK,apti+n I

GtrIGtd 0idth a#ign ,enter I3&t U - dSng UGKtdI Gtd 0idth I3&t - dSng UGKtdI

GKtrIGtrIGtd 0idth a#ign ,enter I3&t U - dSng GKtdI Gtd 0idth IGp a#ign ,enter I3&t - dSng GKtdIGKtrIGKta #eIGK +dyI

Tr+ng tag G,apti+nI )n thy ,4 thu&, tDnh va#ign t+p A ngha #$ t)+ t'a Ptrn nh ,Ja !ng2 N1u va#ign +tt+% th t'a * ,Ja !ng sB P y !ng2

1 .1.&.Th6" c@c th^ng -E ch4 c@c 5(fng )%Bn t34 r! bng

Mu n thay }i thng s ,Ja ,, 8Xng t)+ !ng ta th% ,, thu&, tDnh ,h+ tagGta #eI nh8 sauF

Gta #e +rder ,e##padding ,e##spa,ing I

F 3hi u r&ng 8Xng vi n ng+$i !ng


54/66

F >h+!ng tr:ng 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 +rder ,e##padding ,e##spa,ingI

>hi +rder th ta sB ,4 %&t !ng khng ,4 t kb %&t 8Xng vi n n$+2 5ng!ng d)ng n$y * s:p x1p vn !n the+ ,, h$ng th|ng ng2 l i v6i d #i.u

tr+ng !ng )n vqn ,4 th* p dEng ,, tag = h?, nh8 vD dE sau Wy ,hia %$nh nh th$nh hai ,&t danh s,h tr+ng 4 % i ,&t #$ %&t siu #in k1t

Gdiv a#ign,enterIGh I3, /e site P vi.t na%GKh IGta #e +rder ,e##padding ,e##spa,ing IGtrIGtd a#ign#e@tIGa hre@ httpFKK0002vnn2vn I 3ng ty C^_3 - CNNGKaI GKtdIGtd IGa hre@ httpFKK0002t#net2,+%2vn I M)ng ]h8cng na%GKaIGKtdI

GKtrIGtrIGtdIGa hre@ httpFKK0002@pt2vn I3ng ty Y]TGKaIGKtdIGtd IGa hre@ httpFKK0002saig+nnet2vn I_$i gSn netGKaIGKtdIGKtrIGtrIGtdIGa hre@ httpFKK0002netna%2vn I 3ng ty Netna %GKaIGKtdIGtdIGa hre@ httpFKK0002vina+ne2,+%2vn IM)ng ,Ja [& th8cng %)iGKaIGKtdI


55/66

GKtrIGKta #eI

GKdivI

1 .1.$.Th6" "u -Wc ch4 bng

l* t %$u ,h+ !ngA ta th% thu&, tDnh g,+#+r v6i gi tr %$u t8cng ng v$+,, tag ,Ja !ng2 T %$u n n ,h+ t+$n !ng

Gta #e g,+#+r I

T %$u n n ,h+ U h$ng

Gtr g,+#+r I

T %$u n n ,h+ U

Gtd g,+#+r I

Tr+ng 4 #$ ,, gi tr %$uCD dE

>hi ,h8a t %$u ,! !ng


56/66


57/66

1 . 4r"-

Y+r% #$ %&t y1u t 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 v6i3 _,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% ng ,, 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 gwv$+ C^_3A th d #i.u gji 1n server #$ YirstNa%eC^_32

tag F GY+r% M`TH ^3T N I G222,, tag kh,222I GK@+r%I n % gia haitag [

tr+ng 4 thu&, tDnh M`TH ,4 hai gi tr #$ ] _T v$ `T2 N1u gi tr #$ ] _TAn4 ,h+ php gji d #i.u tf %y 3#ient 1n _erver (th8Xng 89, sj dEng tr+ngY+r% nhRp #i.u"2 3Sn v6i `T th ,h 89, sj dEng tr+ng Y+r% vn tin2 3Sn

^3T N ,h ra v trD ,Ja 3 _,ript trn _erver sB 89, th', hi.n2 3, tag tr+ngY+r% th8Xng d5ng ,hJ y1u #$ G N]TIA G_`L`3TIA G ]T NI2

3h;ng ta sB #Qn #89t xt %&t s Y+r% cn gi!n nh8 sau F

Text Blocks : T)+ ra v5ng vn !nA ,4 th* nhRp nhi u dSng. Text Boxes : l* nhRp v$+ %&t dSng cn2 Password Boxes : Y+r% n$y gi ng 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 xu ng2 Sub it and Reset Buttons : 3, [utt+n * nhRn thng tin v$ khPi t)+ #)i

thng tin trn @+r%2 !idden "le ents : 3, y1u t zn2 #cti$e % a&es :T)+ , !nh kD,h h+)t2 C'% Scri(t :Co on 'atewa) %nter*ace Scri(t.

+,.+. [$i h?,2

Text Blocks :


58/66

Text Boxes :


59/66

th n4 sB #$ %&t %enu zy xu ng2 M i#'a ,h?n ,Ja )n 89, % t! ng ,,tag ]T NA v$ )n ,4 th* ngQ% nh #$n4 89, ,h?n ng 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 khinhRp #i.u s+ngA ng8Xi d5ng n v$+ _u %it th %?i thng tin sB gji 1n server2N1u ,4 thng tin sai Vuy nh th #Rp t , server sB gji tr! #)i k{% v6i thng tin

+ # i23Sn n;t eset sB khPi t)+ #)i t+$n & ,, gi tr ,Ja @+r% ng ,, gi tr %


60/66

th1 gi6i2 [)n ,h vi1, ,#i,k #n !n A gi! sj )n sinh ra P Ci.t na% th ,h 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 ng ,,h ,#i,k #nL2 N4 ,4 th* 89, vi1t ng ngn ng %y tDnh nh8 3 hay ]as,a#A h+


61/66

_au khi nhRp s+ngA ,#i,k v$+ _u %it * gji thng tin 1n _erver2

3h;, )n th$nh ,ng2

3+pyright y Ca#ue ^dder _ervi,e 3enter (C^_3"2 ^## ights eserved2`-%ai#F i-t+day vas,2vnn2vn

1N. Mult%"&/%! \ 'Xu b3n c l4!< h + ) n t4 l6n...

3, )n thWn %1nA %&t tr+ng nhng y1u t khng th* thi1u * #$% trang 0e,Ja )n sinh &ng hcn v$ h+$n h!+ hcn 4 #$ W% thanh v$ h nh !nh &ng2 Hi.nnay ,, tr nh duy.t 0e ,4 th* nhRn d)ng 89, rt nhi u #+)i W% thanh v$ h nh!nh kh, nhau2 Nh8ng ,4 %&t vn #$ nh8 )n = i1tA kD,h th86, ,Ja ,, @i#e%edia rt #6n2 %&t @i#e W% thanh ,ht #89ng t t ,4 thXi gian U giWy th kD,hth86, ,Ja n4 , > v$ * t!i xu ng ph!i %t Dt nht #$ %&t ph;t2 ]h!i ng i,hX 1n %&t ph;t trn %y ,h * , g:ng 89, nghe nh), th Vu! #$ khng th*


62/66

,hp nhRn 89,A hcn na sau khi t!i xu ng $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#ethD,h h9pA ,4 kD,h th86, ,$ng nh ,$ng t t2 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#evide+ avi ( 2avi"222

Tr+ng $i h?, n$y ,, )n sB h?, ,,h g?i %&t @i#e W% thanh v$ %&t h+)t ,!nhvide+ 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 n n ta d5ng tag G gs+undsr, s+und2ext L++p I2 Tag n$y khng ,4 tag k1t th;,2 Thu&, tDnh sr, ,h ra8Xng dqn 1n @i#e W% thanh s+und2ext trn server 3Sn thu&, tDnh L++p ,h+php #


63/66

l1n Wy )n ,4 th* #$% ,h+ trang 0e ,Ja )n sinh &ng hcn r i y2 3h;, )nth$nh ,ng 2

3+pyright y Ca#ue ^dder _ervi,e 3enter (C^_3"2 ^## ights eserved2`-%ai#F i-t+day vas,2vnn2vn

[email protected].!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 hi )n ,hia trang /e ,Ja % nh ra a+ nhiu @ra%e th )n ph!i t)+ ra ynhiu @i#e HTML * % i @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%#IGheadIGtit#eITiu trang /e ,Ja )nGKtit#eIGKheadIG@ra%eset r+0sK,+#s AA22A IG@ra%e na%e @ra%e na%eU sr, LU I


64/66

G@ra%e na%e @ra%e na%e sr, L I22222222G@ra%e na%e @ra%e na%en sr, Ln IGK@ra%esetIGn+@ra%esI

_+rry \ Tr nh duy.t ,Ja )n khng h tr9 @ra%eGKn+@ra%esIGKht%#I

Tr+ng 4 tag G@ra%esetI ,4 t, dEng * ,h ra ,,h ,hia @ra%e the+ ,hi u nganghay ,hi u d?,2 N1u )n nh phWn ,hia the+ ,hi u d?, th d5ng tag G@ra%esetInh8 sau F

G@ra%eset ,+#s AA22A I

C6i AA22A #$ & r&ng ,Ja ,, @ra%eA )n ,4 th* ,h+ gi tr #$ i*%A phQn

tr%222AvD dEG@ra%eset ,+#s UA I

G@ra%eset ,+#s U A I

G@ra%eset ,+#s UA I

tr+ng vD dE ,u i ,5ng )n thy ,4 du 2 u ,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' i v6i trang ,hia the+ ,hi u ngang2Tag 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 v$ hi*n th @i#e HTML ,4 tn #$ gi tr ,Ja thu&, tDnh sr,

Tag Gn+@ra%esI 222 GKn+@ra%esI d5ng * hi*n th thng + khi tr nh duy.t ,Jang8Xi ?, /e khng h tr9 @ra%eA vD dE

Gn+@ra%esI_+rry \ Tr nh duy.t ,Ja )n khng h tr9 @ra%e

GKn+@ra%esICD dE khi %u n ,hia %&t trang /e nh8 sau F


65/66

)n ph!i #$% nh8 sau F

Ght%#IGheadIGtit#eI^ M+re 3+%p#ex Yra%ed ]ageGKtit#eI GKheadIGY^M`_`T /_ U A IGY^M` _3 r+0U2ht%# IGY^M`_`T 3 L_ A IGY^M`_`T /_ A IGY^M` _3 r+0 ,+#Ur+0U2ht%# I GY^M` _3 r+0 ,+#Ur+0 2ht%# IGK@ra%esetIGY^M`_`T /_ UA I GY^M` _3 r+0 ,+# Ur+0U2ht%# IGY^M` _3 r+0 ,+# Ur+0 2ht%# I GK@ra%esetIGK@ra%esetIGK@ra%esetIGN Y^M`_IThis is 0hat s+%e+ne 0+u#d see 0h+ d+es n+t have a 0e

r+0ser that ,an disp#ay @ra%esGKN Y^M`_IGKht%#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


66/66

t8cng ng hi.n #n @ra%e disp#ayA * #$% 89, i u 4A tr+ng @i#e HTML ,Ja@ra%e %enu )n 8a th% tag G aseI v$+ ngay sau tag G +dyI

222

G +dyIG ase target disp#ay I

222

>hi )n khng %u n hi*n th +rder ,Ja @ra%eA )n th% thu&, tDnh +rder v$ @ra%e +rder v$+ tag G@ra%esetI

GY^M`_`T /_ A AU [ ` @ra%e +rder I

Tr+ng tr nh duy.t )n khng %u n 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` %y@ixed@ra%e +rder @ra%e +rder U _3 @ixed2ht%#N `_ `I

[email protected]/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 UA A A A A A2

3, )n thWn %1nA Vua ,, $i h?,A ,, )n = n:% 89, kh vng nhngkhi1n th , ,c !n nht v HTML2 iX 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 dEnh8 xWy d'ng trang 0e v gia nh )n hay %&t nh4% )n { thWn thi1t ,Ja

)n ,h|ng h)n2

3h;, )n th$nh ,ng

HTML Vnn Căn bản

Documents

Transcript of HTML Vnn Căn bản