VIETHANIT

MC LCCHNG 1................................................................................................................................1 GII THIU CHUNG................................................................................................................1 Cc ngn ng nh du dng cho thit b in t...................................................................1 Ngn ng nh du thit b cm tay...................................................................................1 Ngn ng nh du v tuyn..............................................................................................1 Ngn ng nh du siu vn bn thu nh...........................................................................1 Cc ngn ng nh du vn bn ng dng Web....................................................................2 Ngn ng nh du siu vn bn........................................................................................2 Ngn ng nh du m rng...............................................................................................2 Ngn ng XHTML.............................................................................................................2 Ngn ng DHTML.............................................................................................................3 Ngn ng nh du siu vn bn (HTML).............................................................................3 Gii thiu HTML................................................................................................................3 c im ca HTML..........................................................................................................4 Cu trc ca mt ti liu HTML.........................................................................................5 Qui trnh to mt ti liu HTML.........................................................................................6 CHNG 2................................................................................................................................8 CC TH C BN TRONG HTML........................................................................................8 Th v cc thuc tnh ca th..................................................................................................8 Cc th c bn trong HTML...................................................................................................9 Th xc nh vn bn HTML..............................................................................................9 Th xc nh phn u cho trang web.................................................................................9 Th xc nh tiu cho vn bn HTML...........................................................................9 Th xc nh cc danh mc trang web.............................................................................10 Th to danh sch..............................................................................................................11 Th to danh sch khng th t....................................................................................12 Th to danh sch c th t..........................................................................................14 Th xc nh vn bn trang web...................................................................................19 Th to ng thng.........................................................................................................19 Th xc nh dng ch thch.............................................................................................21 Cc th vn dng vi vn bn...............................................................................................21 Th vn dng cho kiu ch...............................................................................................21 2.3.1.1 Lm ch m.....................................................................................................21 2.3.1.2 Lm ch in nghing.........................................................................................22 2.3.1.3 Thay i kch thc ch...................................................................................23 2.3.1.4 To dng ch thp.............................................................................................23 2.3.1.5 To dng ch cao..............................................................................................24 2.3.1.6 Gch ngang v gch di ch...........................................................................25 2.3.1.7 To ch dng ring............................................................................................25 2.3.1.8 To dng ch b xo..........................................................................................25 2.3.1.9 To dng ch chn vo.....................................................................................25 Th vn dng cho hiu ng font ch................................................................................25 2.3.2.1 Chn font ch cho vn bn...............................................................................25 2.3.2.2 i c ch vn bn...........................................................................................26 2.3.2.3 Chn c ch mc nh......................................................................................27 2.3.2.4 i mu ch......................................................................................................27 2.3.2.5 Lm ch nhp nhy...........................................................................................27 Th vn dng trnh by trang Web........................................................................................27 La chn mu nn.............................................................................................................27

HTML v JavaScript

Trang i

VIETHANITLa chn hnh nh lm nn...............................................................................................28 Chnh l cho trang Web....................................................................................................29 To on vn bn..............................................................................................................29 Ngt on..........................................................................................................................30 Mt s th c bit khc.......................................................................................................31 Th lm vic vi siu lin kt...........................................................................................31 Gii thiu siu lin kt v URL....................................................................................31 S dng siu lin kt.....................................................................................................32 Th Meta...........................................................................................................................38 Cc th DIV v SPAN......................................................................................................39 Cc th mc on..............................................................................................................40 2.5.3.1 Th .............................................................................................40 2.5.3.2 Th ....................................................................................41 2.5.3.3 Th ........................................................................................................42 S dng k t c bit trong ti liu HTML.........................................................................43 CHNG.................................................................................................................................48 LM VIC VI BNG - BIU MU KHUNG V A PHNG TIN....................48 Lm vic vi bng.................................................................................................................48 Cch to bng....................................................................................................................48 Cc thuc tnh ca bng....................................................................................................50 Thuc tnh ca th ......................................................................................50 Thuc tnh ca th ..............................................................................................50 Thuc tnh ca th ..............................................................................................51 Hiu chnh bng................................................................................................................52 To khung vin cho bng..............................................................................................52 Thay i kch thc bng..............................................................................................53 B sung cnh v ng k li.....................................................................................53 Trang tr vn bn chung quanh bng.............................................................................54 Kt hp cc ct v cc dng.........................................................................................55 Canh l ni dung trong ...............................................................................................57 S dng hnh nh lm nn cho bng.............................................................................57 Lm vic vi biu mu..........................................................................................................59 S dng biu mu..............................................................................................................59 Phn t FORM..................................................................................................................59 Cc phn t nhp ca HTML............................................................................................60 Phn t INPUT..............................................................................................................60 Button............................................................................................................................61 Textbox.........................................................................................................................61 Checkbox......................................................................................................................61 Radio.............................................................................................................................62 Submit...........................................................................................................................62 nh................................................................................................................................63 Reset..............................................................................................................................63 Phn t TextArea..........................................................................................................64 Phn t BUTTON.........................................................................................................65 Phn t Select................................................................................................................67 Phn t LABEL.............................................................................................................70 To biu mu.....................................................................................................................71 Thit lp tiu im (Focus)...........................................................................................73 Th t tab......................................................................................................................74 Phm truy cp (Access Keys)........................................................................................74

HTML v JavaScript

Trang ii

VIETHANITPhn t v hiu ho.......................................................................................................74 Lm vic vi khung..............................................................................................................74 dng...................................................................................................................................75 Ti sao s dng khung?.....................................................................................................75 Lm vic vi khung.........................................................................................................75 3.3.2.1 S dng khung..................................................................................................75 3.3.2.2 Lin kt cc khung............................................................................................80 3.3.2.3 Phn t NOFRAMES........................................................................................81 3.3.2.4 Phn t IFRAMES (inline frame).....................................................................82 Lm vic vi a phng tin................................................................................................83 S dng hnh nh trong ti liu HTML.............................................................................83 Chn nh tnh................................................................................................................84 Chn nh ng (.GIF) vo ti liu HTML....................................................................86 Chn m thanh vo ti liu HTML...................................................................................87 Chn video vo ti liu HTML.........................................................................................88 CHNG 4..............................................................................................................................89 STYLE SHEET.........................................................................................................................89 DHTML................................................................................................................................89 Gii thiu DHTML...........................................................................................................89 Cc c im ca DHTML...............................................................................................90 Style sheet.............................................................................................................................91 4.2.1 Khi nim, chc nng v cc li ch ca style sheet................................................91 4.2.2 Quy tc stylesheet....................................................................................................94 4.2.3 Cc Selector trong style sheet..................................................................................96 4.2.4 Kt hp v chn mt style sheet vo ti liu HTML.............................................103 4.2.5 Thit lp thuc tnh trong style sheet.....................................................................105 CHNG 5............................................................................................................................106 TNG QUAN V JAVASCRIPT..........................................................................................106 5.1 Gii thiu v Javascript.................................................................................................106 Javascript.........................................................................................................................106 Tm hiu lch s ca JavaScript......................................................................................106 Ngun gc ca JavaScript...........................................................................................107 JavaScript n vi Internet Explorer...........................................................................107 JavaScript tr thnh chun chnh thc........................................................................107 JavaScript hin nay pht trin n u?.................................................................108 Nhng Javascript vo file HTML...................................................................................108 Dng th ...................................................................................................109 Dng file bn ngoi.....................................................................................................110 Dng JavaScript trong trnh x l s kin..................................................................111 Th v ...........................................................................112 Bin, hng v cc kiu d liu trong JavaScript.................................................................113 5.2.1 Bin v phn loi bin............................................................................................113 5.2.2 Hng.......................................................................................................................114 5.2.3 Cc kiu d liu trong JavaScript..........................................................................115 5.2.3.1 Kiu s nguyn................................................................................................116 5.2.3.2 Kiu s thc (kiu s du chm ng)............................................................116 5.2.3.3 Kiu Logical (hay Boolean)............................................................................116 5.2.3.5 Kiu null..........................................................................................................117 Cu hi v bi tp................................................................................................................118 CHNG 6............................................................................................................................119 TON T V BIU THC TRONG JAVASCRIPT..........................................................119

HTML v JavaScript

Trang iii

VIETHANIT6.1 Cc ton t trong JavaScript.........................................................................................119 6.1.1 Cc ton t thng dng..........................................................................................119 6.1.1.1 Ton t gn.....................................................................................................119 6.1.1.2 Ton t s hc.................................................................................................120 6.1.1.3 Ton t so snh...............................................................................................121 6.1.1.4 Ton t logic...................................................................................................122 6.1.1.5 Ton t thao tc trn bit.................................................................................123 6.1.1.6 Ton t chui..................................................................................................125 6.1.2 Mt s ton t khc................................................................................................126 6.1.2.1 Ton t iu kin...........................................................................................126 6.1.2.2 Ton t du phy............................................................................................126 6.1.2.3 Ton t new....................................................................................................126 6.1.2.4 Ton t typeof.................................................................................................126 6.1.2.5 Ton t this.....................................................................................................128 6.1.3 Th t u tin ca cc ton t................................................................................129 6.2 Cc biu thc trong JavaScript.....................................................................................129 6.2.1 Biu thc regular....................................................................................................130 6.2.2 To ra mt biu thc regular..................................................................................132 6.2.2.1 Khi to i tng (Object initializer)............................................................133 6.2.2.2 Gi hm khi to ca i tng RegExp........................................................133 6.2.3 S dng biu thc regular......................................................................................134 6.3 Cu hi v bi tp..........................................................................................................136 CHNG 7............................................................................................................................139 CU LNH IU KIN.......................................................................................................139 7.1 Lnh v khi lnh..........................................................................................................139 7.1.1 Lnh v quy c lnh trong JavaScript..................................................................139 7.1.2 Khi lnh................................................................................................................139 7.2 Cc cu lnh iu kin..................................................................................................139 7.2.1 Cu lnh ifelse....................................................................................................139 7.2.2 Cu lnh switch......................................................................................................143 7.3 Cu hi v bi tp..........................................................................................................146 CHNG 8............................................................................................................................149 CU LNH VNG LP.......................................................................................................149 8.1 Cc lnh vng lp trong JavaScript...............................................................................149 8.1.1 Cu lnh for............................................................................................................149 8.1.2 Cu lnh do..while.................................................................................................151 8.1.3 Cu lnh while.......................................................................................................152 8.2 Cc lnh chuyn iu khin trong vng lp..................................................................153 8.2.1 Cu lnh label.........................................................................................................153 8.2.2 Cu lnh break.......................................................................................................153 8.2.3 Cu lnh continue...................................................................................................154 8.3 Cc lnh thao tc trn i tng...................................................................................156 8.3.1 Cu lnh forin.....................................................................................................156 8.3.2 Cu lnh with.........................................................................................................157 8.4 Cu hi v bi tp..........................................................................................................158 CHNG 9............................................................................................................................160 HM.......................................................................................................................................160 9.1 Khi nim v cc thao tc trn hm..............................................................................160 9.1.1 Khi nim v hm..................................................................................................160 9.1.2 To hm..................................................................................................................160 9.1.3 Gi hm..................................................................................................................162

HTML v JavaScript

Trang iv

VIETHANIT9.1.4 Cu lnh return.......................................................................................................162 9.2 Mt s hm thng dng c h tr bi JavaScript.....................................................164 9.2.1 Hm eval................................................................................................................164 9.2.2 Hm isFinite...........................................................................................................164 9.2.3 Hm isNaN.............................................................................................................165 9.2.4 Cc hm parseInt v parseFloat.............................................................................165 9.2.5 Cc hm Number v String....................................................................................166 9.3 Cu hi v bi tp..........................................................................................................166 CHNG 10..........................................................................................................................169 MNG....................................................................................................................................169 10.1 Khi nim v mng v cc thao tc trn mng trong JavaScript................................169 10.1.1 Khi nim v mng..............................................................................................169 10.1.2 To mng..............................................................................................................169 10.1.3 Gn gi tr cho cc phn t mng.........................................................................169 10.1.4 Truy cp n cc phn t mng...........................................................................171 10.2 Cc phng thc ca mng.........................................................................................171 10.2.1 Phng thc concat..............................................................................................172 10.2.2 Phng thc join..................................................................................................172 10.2.3 Phng thc pop..................................................................................................174 10.2.4 Phng thc push.................................................................................................174 10.2.5 Phng thc reverse.............................................................................................174 10.2.6 Phng thc sort..................................................................................................175 10.3 Mng hai chiu............................................................................................................176 10.4 Cu hi v bi tp........................................................................................................178 CHNG 11..........................................................................................................................180 CC I TNG C BN CA JAVASCRIPT...............................................................180 11.1 i tng Math..........................................................................................................181 11.1.1 M t....................................................................................................................181 11.1.2 Cc thuc tnh ca i tng Math......................................................................182 11.1.3 Cc phng thc ca i tng Math..................................................................183 11.2 i tng String.........................................................................................................185 11.2.1 M t....................................................................................................................185 11.2.2 Cc thuc tnh ca i tng String.....................................................................186 11.2.3 Cc phng thc ca i tng String................................................................186 11.2.4 Tm kim trong mt chui...................................................................................188 11.2.5 nh v cc k t trong mt chui.......................................................................190 11.3 i tng Date...........................................................................................................192 11.3.1 M t....................................................................................................................192 11.3.2 Cc nhm phng thc ca i tng Date........................................................193 11.3.3 Cc phng thc ca i tng Date...................................................................193 11.3.3.1 Nhm phng thc get.................................................................................193 11.3.3.2 Nhm phng thc set..................................................................................194 11.3.3.3 Nhm phng thc to...................................................................................194 11.3.3.4 Nhm phng thc parse v UTC................................................................194 11.4 Cu hi v bi tp........................................................................................................195 CHNG 12..........................................................................................................................199 X L FORM V CC S KIN CHO CC PHN T TRN FORM..........................199 12.1 Gii thiu v i tng form......................................................................................199 12.1.1 M t i tng....................................................................................................199 12.1.2 Cc thuc tinh v phng thc ca i tng form............................................199 12.2 X l s kin trong JavaScript....................................................................................201

HTML v JavaScript

Trang v

VIETHANIT12.2.1 Khi nim v s kin v trnh x l s kin........................................................201 12.2.2 Cc s kin JavaScript ph bin..........................................................................202 12.2.3 Lm vic vi trnh x l s kin..........................................................................212 12.2.3.1 Trnh x l s kin cho cc th HTML.........................................................212 12.2.3.2 Trnh x l s kin nh l nhng thuc tnh.................................................213 12.3 S dng s kin cho cc thnh phn trn form...........................................................214 12.3.1 i tng Textfield (Trng vn bn)................................................................214 12.3.2 i tng Command Button................................................................................216 12.3.3 i tng Checkbox............................................................................................217 12.3.4 i tng radio....................................................................................................219 12.3.5 i tng ComboBox (la chn)........................................................................222 12.3.6 Kim tra tnh hp l ca ni dung cc trng trn form......................................222 12.4 Cu hi v bi tp........................................................................................................227

HTML v JavaScript

Trang vi

VIETHANIT

Chng 1. Gii thiu chung

CHNG 1

GII THIU CHUNGTrong ngnh in n trc y, ch th cho th in sp ch trong vn bn, tc gi hay ch bt thng v cc vng trn trong bn tho v ch thch bng mt ngn ng, tng t tc k. Ngn ng c gi l ngn ng nh du (Markup Language). Do nhng nhu cu pht trin ca khoa hc cng ngh m ngi ta xy dng ra mt ngn ng c tn: Ngn ng nh du tng qut (SGML - Standard Generalized Markup Language). SGML c pht trin bi Ed Mosher, Ray Lorie v Charles F. Goldfarb ca nhm IBM research vo nm 1969. Ban u n c tn l Generalized Markup Language (GML), v c thit k din t cc ngn ng khc bao gm vn phm, t vng ca chng. Nm 1986, SGML c t chc ISO (International Standard Organisation) thu nhn lm tiu chun lu tr v trao i d liu. V sau ny cc ngn ng nh du thit b in t, thit k Web c pht trin da vo c s ca ngn ng nh du tng qut SGML. 1.1 Cc ngn ng nh du dng cho thit b in t Mt s ngn ng nh du c s dng cung cp cc dch v v ni dung n cc thit b in t nh my nhn tin, in thoi di ng, thit b v tuyn. Cc ngn ng bao gm: Ngn ng nh du thit b cm tay, ngn ng nh du v tuyn v ngn ng nh du siu vn bn thu nh. 1.1.1 Ngn ng nh du thit b cm tay Ngn ng nh du thit b cm tay (HDML - Handheld Device Markup Language) c thit k cho my nhn tin v tuyn, in thoi, t bo in t v cc thit b cm tay ly cc thng tin t cc trang Web. HDML l mt tp hp con ca WAP, c Openwave Systems xy dng trc khi chun WAP ra i. Cng ty AT&T Wireless m dch v da trn HDML vo nm 1996. HDML trc tin c to ra xy dng ni dung da trn Web cho my in thoi di ng v cc thit b cm tay. Vo nm 1997, HDML 2.0 c tung ra cho php ngi s dng nhn cc thng s chng khon, cc u tin tc, cc cnh bo th in t trn my in thoi di ng. 1.1.2 Ngn ng nh du v tuyn Ngn ng nh du v tuyn (WML - Wireless Markup Language) l mt ngn ng da trn th c s dng trong giao thc ng dng v tuyn. WML l mt loi vn bn XML cho php cc cng c XML v HTML s dng pht trin cc ng dng WML. WML c pht trin t HDML ca Openwave nhng n khng phi l mt siu tp hp ca HDML, cc c trng HDML khng xut hin trong WML. Tiu chun WML chnh thng c pht trin v c din n WAP duy tr. WML c bn lnh vc chc nng quan trng: mu v hin th k t; t chc, nh v th v tp; kt ni v nh v lin th; th hin thng s chui v qun l trnh trng thi. 1.1.3 Ngn ng nh du siu vn bn thu nh HTML v JavaScript Trang 1

VIETHANIT

Chng 1. Gii thiu chung

Ngn ng nh du siu vn bn thu nh (cHTML - Compact HTML) l mt tp hp con ca HTML cho in thoi t bo v PDA, c cng ty NTT Docomo pht trin cho h thng v tuyn i-Mode Nht Bn. cHTML c thit k cho vic hin th mn hnh v h tr mt s chc nng ca cc thit b cm tay. V d, cHTML h tr cc nt bm di chuyn khi con chut khng c s dng. 1.2 Cc ngn ng nh du vn bn ng dng Web1.1

Ngn ng nh du siu vn bn

Ngn ng nh du siu vn bn (HTML - Hyper Text Markup Language) l mt ngn ng nh du c thit k to ra cc trang Web, trong cc thng tin c trnh by trn World Wide Web. HTML l mt ng dng n gin ca SGML, c s dng trong cc t chc cng ngh truyn thng. HTML gi y tr thnh mt chun Internet do t chc World Wide Web Consortium (W3C) duy tr. Phin bn mi nht ca n hin l HTML 4.01. Tuy nhin, HTML hin khng cn c pht trin tip, ngi ta thay th n bng XHTML. HTML tn ti nh l cc tp tin vn bn cha trn cc my tnh ni vo mng Internet. Cc file ny cha th nh du, l cc ch th cho chng trnh v cch hin th, x l vn bn dng thun ty. Cc file ny thng c truyn i trn mng internet thng qua giao thc mng HTTP, sau th phn HTML s c hin th thng qua mt trnh duyt web, cc trnh duyt m nhim cng vic c vn bn ca trang cho ngi s dng, phn mm c email, hay mt thit b khng dy nh in thoi di ng.1.2

Ngn ng nh du m rng

Ngn ng nh du m rng (XML eXtend Markup Language) kh ging vi HTML, hai ngn ng ny c cng lut c php. Tuy nhin, tnh linh hot ca XML cho php bn to v s dng tp th v tp thuc tnh ring nhn bit cc phn t cu trc v ni dung ti liu. XML khng ch l ngn ng nh du, n cn c phng php nh ra ni dung ti liu, tng t nh HTML nh hnh thc ti liu trn Web. Vi HTML, ngi thit k nh du vn bn, hnh nh cng cc thnh phn khc ca trang Web bng tp th m khng lin quan ti ngha ti liu, XML khng ch ch nh hnh thc m cn c ni dung ti liu. XML c xem l cng c mnh hn HTML do n mang li thng tin y v d liu. Mt s t chc chuyn mn xy dng ngn ng XML ring, bao gm cc th nhn din c t cng nghip. V d: Ngnh cng nghip ha hc pht trin Chemical Markup Language (CML). XML gip bn to ti liu c lp vi server. Ti liu c nm ngay trn my khi ti liu c ti v tip tc s dng khng ph thuc vo Server. Mt khc XML mang tnh cht ch theo tiu chun ca ngn ng nh du vn bn.1.3

Ngn ng XHTML

XHTML l s kt hp gia HTML 4.0 v XML 1.0 thnh mt nh dng ring cho Web. XHTML cho php HTML m rng bng cc th s hu. XHTML c m ha cht ch hn HTML v phi tun th nhiu quy tc cu trc hn. HTML v JavaScript Trang 2

VIETHANIT

Chng 1. Gii thiu chung

XHTML 1.0 c thit k nhm mc ch to thi quen tt cho ngi xy dng trang Web. Bi v c rt nhiu ngi trnh by trang Web theo cch thc ca mt trnh duyt th hin m khng quan tm ti s dng cc HTML chun, iu ny s gy ra hai tc hi: Th nht l kt qu hin th s ph thuc vo trnh duyt ca ngi s dng, th hai l to ra thi quen khng tt khi thit k, l ch quan tm ti trnh duyt th hin mc ch ca mnh m khng quan tm chun ca n. S dng XHTML chun l nhng bc u tin sn sng xy dng v trin khai XML v vic xy dng XML i hi phi cht ch hn HTML v XML khng chp nhn mt li c php trong ti liu. C hai l do s dng XHTML cho Website: - Xy dng cc trang web ng mt cch tin cy, da vo c php cht ch. D liu cho cc trang Web ng thng c khai thc t c s d liu, cc file hoc cc ngun khc v c hin th theo nhng template ph thuc vo yu cu ca ngi s dng. Vic xy dng mt cch cu th s khng ch gy ra nhng li trong vic chn d liu vo nhng v tr trong trang Web m c th gy ra nhng li tr v pha ngi dng. - Vic xy dng trang Web bng XHTML s nhanh hn bi trnh duyt s khng mt nhiu thi gian dch, v sa li .1.4

Ngn ng DHTML

Khi Microsoft v Netscape a ra Version 4 ca cc trnh duyt, th nhng nh pht trin Web c mt la chn mi: Dynamic HTML (DHTML). Trong thc t n l mt tp hp gm HTML, Cascading Style Sheets (CSS), v JavaScript. Tp hp cc cng ngh trn cho php cc nh pht trin sa i ni dung v cu trc ca mt trang Web mt cch nhanh chng. DHTML yu cu s h tr t cc trnh duyt. Mc d c Internet Explorer v Netscape u h tr DHTML, nhng cch th hin ca chng l khc nhau, v vy cc nh pht trin cn phi bit c loi trnh duyt no m pha client dng. DHTML tht s l mt bc tin mi. Hin nay DHTML vn ang trn con ng pht trin mnh. DHTML gip tng cng tnh tng tc ca cc i tng iu khin trong trang HTML tnh bng cch cho php ngi dng VBscript hoc Javascript iu khin chng. V d mt th image nhng nh vo trang web c th nhn bit khi ngi dng di chuyn chut trn n bng cch ci t hm x l s kin OnMouseOver, khi thng qua nhng x l thch hp s lm i tng hnh nh tr nn sng ng hn. Nhn chung, bn cnh nhng m rng nh to nhng hiu ng MouseOver, chui ch di chuyn ng, thay i mu sc,... Cc kha cnh bo mt ca DHTML tng t nh HTML v n da trn nn tng HTML.1.3 Ngn ng nh du siu vn bn (HTML) 1.1

Gii thiu HTML

Ngn ng nh du siu vn bn ch r mt trang Web c hin th nh th no trong mt trnh duyt. S dng cc th v cc phn t HTML, bn c th:

iu khin hnh thc v ni dung ca trang. Trang 3

HTML v JavaScript

VIETHANIT

Chng 1. Gii thiu chung

Xut bn cc ti liu trc tuyn v truy xut thng tin trc tuyn bng cch s dng cc lin kt c chn vo ti liu HTML.

To cc biu mu trc tuyn thu thp thng tin v ngi dng, qun l cc giao dch Chn cc i tng nh audio clip, video clip, cc thnh phn ActiveX v cc Java Applet vo ti liu HTML. Ti liu HTML to thnh m ngun ca trang Web. Khi c xem trn trnh son tho, ti liu ny l mt chui cc th v cc phn t, m chng xc nh trang Web hin th nh th no. Trnh duyt c cc file c ui .htm hay .html v hin th trang Web theo cc lnh c trong . V d, theo c php HTML di y, trnh duyt s hin th thng ip My first HTML document V d 1.1: Welcome to HTML My first HTML document

Kt qu:

Hnh 1.1: Kt qu v d 1.11.2

c im ca HTML Trang 4

HTML v JavaScript

VIETHANIT

Chng 1. Gii thiu chung

Ti liu HTML c hin th trn trnh duyt. Vy trnh duyt l g? Trnh duyt l mt ng dng c ci t trn my khch. Trnh duyt c m ngun HTML v hin th trang theo cc lnh trong . Trnh duyt c s dng xem cc trang web v iu hng. Trnh duyt c bit n sm nht l Mosaie, c pht trin bi trung tm ng dng siu my tnh quc gia (NCSA). Ngy nay, c nhiu trnh duyt c s dng trn Internet. Netscape Navigator v Microsoft Internet Explorer l hai trnh duyt c s dng ph bin. i vi ngi dng, trnh duyt d s dng bi v n c giao din ho vi vic tr v kch chut. to mt ti liu ngun, bn phi cn mt trnh son tho HTML. Ngy nay, c nhiu trnh son tho ang c s dng: Microsoft FrontPage l mt cng c tng hp c dng to, thit k v hiu chnh cc trang web. Chng ta cng c th thm vn bn, hnh nh, bng v nhng thnh phn HTML khc vo trang. Thm vo , mt biu mu cng c th c to ra bng FrontPage. Mt khi chng ta to ra giao din cho trang web, FrontPage t ng to m HTML cn thit. Chng ta cng c th dng Notepad to ti liu HTML. xem c ti liu trn trnh duyt, bn phi lu n vi ui l .htm hay .html. Cc lnh HTML c gi l cc th. Cc th ny c dng iu khin ni dung v hnh thc trnh by ca ti liu HTML. Th m () v th ng (), ch ra s bt u v kt thc ca mt lnh HTML. V d, th HTML c s dng nh du s bt u v kt thc ca ti liu HTML.

Ch rng cc th ko phn bit ch hoa v ch thng, v th bn c th sd thay cho Th HTML bao gm:

ELEMENT: nhn dng th ATTRIBUTE: M t th value: gi tr c thit lp cho thuc tnh. V d, Trong v d trn, BODY l phn t, BGCOLOR l thuc tnh mu nn v lavender l gi tr. Khi c php HTML c thc hin, mu nn cho c trang c thit lp l mu lavender.1.3

Cu trc ca mt ti liu HTML Mt ti liu HTML gm 3 phn c bn:

HTML v JavaScript

Trang 5

VIETHANIT

Chng 1. Gii thiu chung

Phn HTML: Mi ti liu HTML phi bt u bng th m v kt thc bng th ng . Cp th ny bo cho trnh duyt bit ni dung gia chng l mt ti liu HTML

Phn u: Phn u bt u bng th v kt thc bi th . Phn ny cha tiu hin th trn thanh iu hng ca trang Web. Tiu l phn kh quan trng. Cc mc c dng nh du mt Website, trnh duyt s dng tiu lu tr cc mc ny. Do , khi ngi dng tm kim thng tin, tiu ca trang Web cung cp t kho chnh yu cho vic tm kim.

Phn thn: Phn ny nm sau phn tiu . Phn thn bao gm vn bn, hnh nh v cc lin kt m bn mun hin th trn trang Web ca mnh. Phn thn bt u bng th v kt thc bng th V d 1.2: Welcome to the world of HTML This is going to be real fun

Kt qu:

Hnh 1.2: Kt qu v d 1.21.4

Qui trnh to mt ti liu HTML

HTML v JavaScript

Trang 6

VIETHANIT nh hnh trang Web

Chng 1. Gii thiu chung

thit k mt trang Web, trc tin chng ta cn phn tch v nh hng mc ch ca trang Web. iu ny gip ta c ci nhn tng qut v trang Web v s thun li cho vic t chc hay nng cp trang Web sau ny. Nhng yu cu cn phi nghin cu. -

Hnh dung ni dung trang Web bn cn to, hng ti mt ch chung cho trang Web vi nhng chc nng v nhim v g? t mnh vo v tr ngi xem, khch hng. Lm th no ni dung trnh by th hin tt nht. V d bn c th thm vo m thanh, hnh nh minh ho cho sinh ng, b cc ni dung, trnh by sao cho hp l nht. T chc tp tin Cc yu t lm nn trang Web l cc tp tin, do vy vic t chc tp tin l rt quan trng, n gip ta thun li trong vic lu tr tm kim cc on m hay c s d liu ca trang Web. Chia cc th mc trung tm theo cu trc ca trang Web, bn c th to mt th mc ring r cho ti liu HTML: cc hnh nh, c s d liu, cc tp tin bn ngoi, Trong trng hp trang Web ln vi nhiu trang, bn c th chia thnh nhiu mc hay chng, chuyn cc hnh nh n th mc c lp.

To trang Web

to mt trang Web HTML chng ta khng cn mt cng c c bit no, ch cn s dng bt k b son tho vn bn no nh Wordpad hay Notepad, c cung cp km theo h phn mm Windows. Da trn qui nh v cu trc ca mt trang Web, kt hp vi cc th cn thit vit ra trang Web ca mnh. Lu trang Web Nu ta s dng mt trnh x l vn bn n gin to trang Web bn s khng c vn g khi lu trang Web. Nhng khi ta dng mt trnh x l vn bn phc tp th bn phi lu nhng thng tin bn ngoi m chng trnh s nh km vo tp tin ca bn. m bo mi trnh duyt s nhn din c tp tin , bn phi t phi t ui ca tp tin ng.-

Mi tp tin c lu phn ui ca n c dng .htm hay .html Chn th mc thch hp lu trang Web. Xem trang Web qua trnh duyt Khi to ra trang Web chng ta cn xem n nh th no qua mt trnh duyt thng thng l Internet Explorer.

-

HTML v JavaScript

Trang 7

VIETHANIT

Chng 2. Cc th c bn trong HTML

CHNG 2

CC TH C BN TRONG HTML2.1 Th v cc thuc tnh ca th

Th l nhng cu lnh c vit gia du nh hn () hay cn gi l du mc nhn, quy nh cch hin th vn bn. C 2 loi th: Th m v th ng, on vn bn hin th nm gia hai th ny, c th m v th ng u c vit nh nhau nhng th ng c thm mt du / ( du xo ti) pha trc.Th m Vn bn ni dung

Th ng

Trang WebMc nhn Du xo ti

Hnh 2.1: Phn tch mt th HTML Thuc tnh ca th Thuc tnh tc ng ln ni dung vn bn. Thuc tnh c nhp vo gia th v du ln hn cui cng. Thng th chng ta dng nhiu thuc tnh trong mt th. Cc thuc tnh c vit khng cn th t v cch nhau mt khong trng.Thuc tnh

Th

Hnh 2.2: Th c th thm vo cc thuc tnh theo nh dng ca ngi vit Thuc tnh thng i km vi cc gi tr. Trong mt s trng hp, c th la chn gia cc gi tr. V d: thuc tnh CLEAR trong th Br c th nhn c cc gi tr left (tri), right (phi), hay all (c hai bn). Tt c cc gi tr khc c a vo s khng c chp nhn.Gi tr ca CLEAR

Hnh 2.3 : Th BR ch chp nhn nhng thuc tnh vi mt gi tr nh sn HTML v JavaScript Trang 8

VIETHANIT

Chng 2. Cc th c bn trong HTML

Cc thuc tnh khc cn xt n dng gi tr m chng c th chp nhn. V d: thuc tnh HSPACE trong th IMG ch chp nhn cc s nguyn lm gi tr.

SRC-mt thuc tnh ca IMG

Gi tr ca SRC

HSPACE cng l mt thuc tnh ca IMG Gi tr ca HSPACE

Hnh 2.4: Th c th thm nhiu thuc tnh khc nhau Gi tr c t gia hai du nhy( ). C th b qua du nhy nu gi tr ch cha ch (A-Z, a-z), s (0-9), du gch ni(_) hoc du chm (.). Th lng nhau Th lng nhau dng chnh sa cch trnh by ni dung trang, v d nh dng ch nghing cho mt vi ch quan trng trong mc. Lu :. Trt t cc th lng nhau: Th c m u tin s l th ng cui cng. V d: Phn 1: Ni dung

Kt qu l: Phn 1: Ni dung2.2 Cc th c bn trong HTML 2.2.1

Th xc nh vn bn HTML C php: Cc ni dung ca vn bn HTML

2.2.2

Th xc nh phn u cho trang HTML C php: Phn u vn bn HTML

Th xc nh phn u ca vn bn HTML, thng thng th th to tiu trang c t lng vo trong th ny.2.2.3

Th xc nh tiu cho vn bn HTML C php: Ni dung tiu ca vn bn HTML

2.2.4

Th xc nh phn thn cho trang HTML C php:

HTML v JavaScript

Trang 9

VIETHANIT Phn thn vn bn HTML

Chng 2. Cc th c bn trong HTML

Tt c ni dung ca trang web c nm gia hai th ny. V d 2.1: tieu de B cc ni dung ca trang web

Kt qu:

Hnh 2.5: Th Body xc nh phn thn ca trang web2.2.5

Th xc nh cc danh mc trang web

Cc danh mc thng c hin th to v m hn phn bit chng vi cc phn cn li ca vn bn. Chng ta c th hin th cc danh mc ny theo mt trong su kch thc t H1 n H6 nh trong v d sau: V d 2.2: Introduction to HTML Introduction to HTML Introduction to HTML Introduction to HTML Introduction to HTML

HTML v JavaScript

Trang 10

VIETHANIT Introduction to HTML Introduction to HTML

Chng 2. Cc th c bn trong HTML

Kt qu:

Hnh 2.6: Minh ho th xc nh cc danh mc cho trang web2.2.6

Th to danh sch

Danh sch dng nhm d liu mt cch logic. Chng ta c th thm cc danh sch vo ti liu HTML nhm cc thng tin c lin quan li vi nhau. V d: Roses Sunflowers Oranges Apples Orchids Mangoes C th c nhm thnh: HTML v JavaScript Trang 11

VIETHANIT Fruits Apples Oranges Mangoes Flowers Roses Sunflowers Orchids

Chng 2. Cc th c bn trong HTML

Cc loi danh sch m bn c th chn vo ti liu HTML l: Danh sch khng th t Danh sch c th t Danh sch nh ngha2.2.6.1 Th to danh sch khng th t

y l loi danh sch n gin nht m bn c th thm vo ti liu HTML. Danh sch khng th t l mt bulleted list. Cc mc c bt u bng du chm trn bullet. Danh sch khng th t c nm trong cp th

. Mi mc trong danh sch c nh du bng th . LI c vit tt ca t List Item. Th kt thc l tu chn (khng bt buc). V d 2.3: Tao danh sach khong thu tu

Monday

Tuesday

Wednesday

Thursday

Friday

HTML v JavaScript

Trang 12

VIETHANIT

Chng 2. Cc th c bn trong HTML

Kt qu:

Hnh 2.7: Minh ho th to danh sch khng th t trong trang web Ngoi ra, chng ta c th to ra cc danh sch lng nhau m t nhm con ca thng tin. V d 2.4: Tao danh sach long nhau

Monday

• Introduction to HTML
• Creating Lists

Tuesday

• Creating Tables
• Inserting Images

HTML v JavaScript

Trang 13

VIETHANIT

Wednesday

Thursday

Friday

Chng 2. Cc th c bn trong HTML

Kt qu:

Hnh 2.8: Minh ho cch to danh sch lng nhau2.2.6.2 Th to danh sch c th t

Danh sch c th t nm trong cp th . Danh sch c th t cng hin th cc mc danh sch. S khc nhau l cc mc danh sch hin th theo th t c to ra mt cch t ng. V d 2.5: Tao danh sach co thu tu

HTML v JavaScript

Trang 14

VIETHANIT Monday Tuesday Wednesday Thursday Friday

Chng 2. Cc th c bn trong HTML

Kt qu:

Hnh 2.9: Minh ho cch to danh sch c th t Chng ta c th t cc thuc tnh nh ngha h thng s m c to ra cho cc mc danh sch. Bng 2.1: Cc thuc tnh dng nh ngha h thng s Thuc tnh Upper Roman Lower Roman Uppercase Lowercase Bt u vi mt s khc ln hn 1 Th

Trong thuc tnh START xc nh s khi to ban u ca danh sch.

HTML v JavaScript

Trang 15

VIETHANIT

Chng 2. Cc th c bn trong HTML

V d 2.6: Danh sach co thu tu Monday Introduction to HTML Creating Lists Tuesday Creating Tables Inserting Images Wednesday Creating forms Working with Frames Thursday Friday

HTML v JavaScript

Trang 16

VIETHANIT

Chng 2. Cc th c bn trong HTML

Kt qu:

Hnh 2.10: Minh ho cch to danh sch c th t Chng ta c th lng cc loi danh sch li vi nhau. C th lng cc danh sch c th t vo trong cc danh sch khng th t v ngc li. V d 2.7: Long cac loai danh sach

Monday

Introduction to HTML

Creating Lists

Tuesday

Creating Tables

Inserting Images

HTML v JavaScript

Trang 17

VIETHANIT

Wednesday

Thursday

Friday

Chng 2. Cc th c bn trong HTML

Kt qu:

Hnh 2.11: Lng cc loi danh sch 2.2.6.3 Th to danh sch nh ngha Danh sch nh ngha c dng to ra mt danh sch cc iu khon v cc nh ngha ca chng. Danh sch nh ngha nm trong cp th . Th c dng ch ra iu khon cn th c dng ch ra nh ngha cho iu khon . V d 2.8: Danh sach dinh nghia Sunday

HTML v JavaScript

Trang 18

VIETHANIT HTML

Chng 2. Cc th c bn trong HTML The first day of the week Hyper Text Markup Language Internet A network of networks TCP/IP Transmission Control Protocol / Internet Protocol

Kt qu:

Hnh 2.12: Danh sch nh ngha2.2.7

Th xc nh vn bn trang web C php: Ni dung ca vn bn

Khi cn trnh by mt ni dung vn bn no , chng ta t cc vn bn nm trong th p.2.2.8

Th to ng thng Trang 19

HTML v JavaScript

VIETHANIT

Chng 2. Cc th c bn trong HTML

Th (horizontal rule) c dng k mt ng thng trn trang. Nhng thuc tnh sau gip iu khin cc ng thng ny. N ch c th bt u, khng c th kt thc v khng c ni dung. Bng 2.2: Cc thuc tnh ca th HR Thuc tnh align M t Ch nh v tr ca ng thng. Chng ta c th canh l center (gia) hoc right (phi) hoc left (tri). V d: align=center Ch di ca ng thng. N c th xc nh bng cc pixel hoc tnh theo phn trm. Mc nh l 100%, ngha l ton b b ngang ca ti liu. Ch dy ca ng thng v c xc nh bng cc pixel. Ch ng c hin th bng mu c thay v c bng.

width

size noshade V d 2.9:

Ke duong thang My first HTML document This is going to be real fun

HTML v JavaScript

Trang 20

VIETHANIT Kt qu:

Chng 2. Cc th c bn trong HTML

Hnh 2.13: Minh ho th to ng thng2.2.9

Th xc nh dng ch thch : Xc nh mt vng ch thch

C php: Khi ch thch cho phn ngun ca trang web, chng ta s dng th ny to ra vng ch thch m khng cho php hin th trn ni dung ca trang web.2.3 Cc th vn dng vi vn bn 2.3.1

Th vn dng cho kiu ch in m mt on vn bn chng ta c cc th sau thc hin. C php: Nhp vn bn vo bn mun lm m

2.3.1.1 Lm ch m

hoc Nhp on vn bn bn mun lm m

V d 2.10: Chu dam

HTML v JavaScript

Trang 21

VIETHANIT This is a bold line text Chng 2. Cc th c bn trong HTMLKt qu:Hnh 2.14: Hin th ni dung dng ch m trn trnh duyt 2.3.1.2 Lm ch in nghing in nghing mt on vn bn ta dng th nh sau C php: Nhp vn bn vo bn mun in nghing V d 2.11: Chu nghieng This is an italic line text HTML v JavaScriptTrang 22VIETHANITChng 2. Cc th c bn trong HTMLKt qu:Hnh 2.15: Hin th ni dung dng ch nghing trn trnh duyt 2.3.1.3 Thay i kch thc ch thay i c ch tng i ca mt t hay mt nhm t so vi cc vn bn xung quanh, ta dng c php sau: C php: Nhp vn bn vo bn mun tng c ch ln hn Nhp vn bn bn mun gim c ch b hn 2.3.1.4 To dng ch thp to cc dng ch thp tng ng vi ch s di ta dng th Sub sau y. C php: Nhp ch hay k hiu bn mun chnh thp V d 2.12: Chu thap Day la dong chu thap HTML v JavaScriptTrang 23VIETHANITChng 2. Cc th c bn trong HTMLKt qu:Hnh 2.16: Minh ho th sub to dng ch thp 2.3.1.5 To dng ch cao to dng ch cao tng ng vi ch s trn ta dng th sup nh sau: C php: Nhp ch hay k hiu bn mun chnh cao V d 2.13: Chu thap Day la dong chu cao HTML v JavaScriptTrang 24VIETHANITChng 2. Cc th c bn trong HTMLKt qu:Hnh 2.17: Minh ho th sup to dng ch cao 2.3.1.6 Gch ngang v gch di ch C php: Nhp vn bn cn gch b Nhp on vn bn cn gch di 2.3.1.7 To ch dng ring nhn mnh hay lm ni bt on vn bn ta dng th sau. C php: on vn bn cn nhn mnh 2.3.1.8 To dng ch b xo C php: Nhp vo on vn bn cn xo Nhp on vn bn cn xo 2.3.1.9 To dng ch chn vo C php: nh dng ch mi chn thm 2.3.2Th vn dng cho hiu ng font ch chn font ch cho on vn bn cn trnh by ta dng th font nh sau C php:2.3.2.1 Chn font ch cho vn bnHTML v JavaScriptTrang 25VIETHANITChng 2. Cc th c bn trong HTML nhp vn bn cn hin th vn bn chnfontname2 l kiu ch u tin th 2 nu nh ngi truy cp khng ci t kiu ch th nht. Mi tn kiu ch phi c ngn cch vi tn ng trc bng du phy. C th thm fontname3, fontname4 cho cc kiu ch u tin tip theo. V d: Vn bn cn nh dng bi font ch. fontname1 l kiu ch c chn u tin. G tn y ca kiu ch m ta mun. 2.3.2.2 i c ch vn bn Khi cn thay i c mt s ch, chng ta c th lm theo hai cch: chn c ch ngay hay iu chnh cho vng ch c to hn hay nh hn cc ch xung quanh. C php: nhp vn bn m bn cn iu chnh c ch Gi tr ca n nhn t 1 n 7. V d 2.14: Chon font chu This is text set by Arial font This is text set by Times new roman font Kt qu:HTML v JavaScriptTrang 26VIETHANITChng 2. Cc th c bn trong HTML Hnh 2.18: Minh ho th font2.3.2.3 Chn c ch mc nh. Khi mun thng nht mt c ch nht nh trn trang Web, ta thng s dng th sau y. C php:n nhn gi tr t 1 n 7, c ch mc nh l 3. 2.3.2.4 i mu ch Mt trong nhng cch lm ni bt vn bn l i mu chng. Bn c th i mt phn vn bn thnh thnh mu khc v phn cn li l mu en. C php: Nhp vn bn bn mun i mu Trong : rrggbb l s thp lc phn biu hin mu mong mun, rr l gi tr thp lc phn ginh cho mu , gg cho xanh l cy, bb cho xanh dng. V d: Tng ng R l 48 (h 16=30), G l 148 (h 16=8F), v B l 158 (h 16=9E) do gi tr trong h thp lc phn tng ng l 308F9E. Tuy nhin ta c th thay i cc gi tr R, G, B trong bng mu c cc gi tr mu khc nhau, hoc l: Nhp vn bn bn mun i mu color l 1 trong 16 mu nh sn. V d: , on vn bn c tc ng bi th s c mu . 2.3.2.5 Lm ch nhp nhy to ra cc hiu ng v ch nh nhp nhy ta c th dng vi th sau C php: Nhp on vn bn cn nhp nhy 2.4 Th vn dng trnh by trang Web 2.4.1La chn mu nnChng ta c th thm mu vo trang v vo cc phn t trong trang. COLOR l thuc tnh c th s dng vi nhiu phn t nh phn t FONT v BODY. V d 2.15: Su dung mau nen HTML v JavaScriptTrang 27VIETHANITChng 2. Cc th c bn trong HTML Welcome to HTML This is good fun Kt qu:Hnh 2.19: S dng mu nn C 3 kiu mu chnh: , xanh v xanh da tri. Mi mu chnh c xem nh mt b hai s ca h 16. #RRGGBB S thp lc phn 00 ch 0% ca mu trong khi s thp lc phn FF ch 100% ca mu. Gi tr cui cng l mt m su ch s ch mu. Bng 2.3: Bng m mt s mu M thp lc phn #FF0000 #00FF00 #0000FF #000000 #FFFFFF2.4.2Mu Red Green Blue Black WhiteLa chn hnh nh lm nnChng ta c th dng hnh nh lm nn cho ton b trang. Hnh nh phi ph hp vi ni dung trang v lm cho trang thm hp dn.HTML v JavaScriptTrang 28VIETHANIT C php:Chng 2. Cc th c bn trong HTML< body background=bgimagine.jpg bgproperties=fixed >bgimagine.gif l a ch hnh nh . bgproperties=fixed chnh hnh nh thnh m bt ng, ch dng trong Internet Explorer. V d 2.16: nen Kt qu:Hnh 2.20: S dng hnh nn2.4.3Chnh l cho trang Web cn l cho ni dung trang, ta c th thay i, iu chnh khong cch cho ph hp vi yu cu thc t bng cch dng cc thuc tnh ca th BODY nh sau: C php:Vi x l rng n v pixel ca l tri, y l khong cch gia u ni dung v nh ca s.2.4.4To on vn bnHTML v JavaScriptTrang 29VIETHANITChng 2. Cc th c bn trong HTMLKhi vit mt bi bo hay mt bi lun, bn nhm ni dung thnh mt lot cc on. Mc ch l nhm cc tng logic li vi nhau v p dng mt s nh dng cho ni dung. Trong mt ti liu HTML, ni dung c th c nhm thnh cc on. Th on c s dng nh du s bt u ca mt on mi. Th ng l khng bt buc. Th k tip s t ng bt u mt on mi. V d 2.17: Tao doan This is going to be real fun Another paragraph element Kt qu:Hnh 2.21: To cc on vi th 2.4.5Ngt onKhi to mt on mi vi th P, hu ht trnh duyt chn thm mt khong trng ln gia chng. bt u on mi m khng c khong trng, hy s dng th BR ngt hng. C php:
Xc nh v tr cn xung dng, khng cn th BR ng.HTML v JavaScriptTrang 30VIETHANITChng 2. Cc th c bn trong HTMLTuy nhin bn c th dng nhiu th BR to ra khong cch gia cc dng hay cc on.2.5 Mt s th c bit khc 2.5.1Th lm vic vi siu lin ktSiu lin kt l mt phn t bn trong ti liu m lin kt n mt v tr khc trong cng ti liu hoc n mt ti liu hon ton khc. Chng hn, khi ta kch vo siu lin kt s nhy n lin kt cn n. Cc siu lin kt l thnh phn quan trng nht ca h thng siu vn bn.2.5.1.1 Gii thiu siu lin kt v URLKh nng chnh ca HTML l h tr siu lin kt. Mt siu lin kt, hay ni ngn gn l mt lin kt, l s kt ni n ti liu hay file khc ( ho, m thanh, video) hoc ngay c n mt phn khc trong cng ti liu . Khi kch vo siu lin kt, ngi dng c a n a ch URL m chng ta ch r trong lin kt. Nh vy, vi siu lin kt, chng ta c th lin kt n: Mt phn khc trong cng ti liu. Mt ti liu khc Mt phn trong ti liu khc Cc file khc (hnh nh, m thanh, trch on video) V tr hoc my ch khc Cc lin kt c th l lin kt trong hoc lin kt ngoi. Lin kt trong l lin kt ni n cc phn khc trong cng ti liu hoc cng mt website. Lin kt ngoi l lin kt kt ni n cc trang trn cc website khc hoc my ch khc. to siu lin kt, chng ta cn phi xc nh hai thnh phn: 1. a ch y hoc URL ca file c kt ni 2. im nng cung cp cho lin kt. im nng ny c th l mt dng vn bn, thm ch l mt nh. Khi ngi dng kch vo im nng, trnh duyt c a ch c ch ra trong URL v nhy n v tr mi. Mi ngun ti nguyn trn Web c mt a ch duy nht. V d, 207.46.130.149 l a ch website ca Microsoft. Gi y, nh cc con s ny rt kh v d nhm ln. V vy, ngi ta s dng cc URL. URL l mt chui cung cp a ch Internet ca website hay ti nguyn trn World Wide Web. nh dng c trng l www.nameofsite.typeofsite.contrycode Trong : Nameofsite: Tn ca site Typeofsite: Kiu ca site Contrycode: M ncV d: 216.239.33.101 c th c biu din bng URL l www.google.com HTML v JavaScript Trang 31VIETHANITChng 2. Cc th c bn trong HTMLURL cng nhn bit c giao thc m site hay ti nguyn c truy nhp. Dng URL thng thng nht l http, n cung cp a ch Internet ca mt trang web. Mt vi dng URL khc l gopher, n cung cp a ch Internet ca mt th mc Gopher, v ftp, cung cp v tr ca mt ti nguyn FTP trn mng. URL cng c th tham chiu n mt v tr trong mt ti nguyn. V d, bn c th to lin kt n mt ch trong cng mt ti liu. Trong trng hp , nh danh on c s dng phn cui ca URL. C hai dng URL:URL tuyt i l a ch Internet y ca trang hoc file, bao gm giao thc, v tr mng, ng dn tu chn v tn file. V d, http://www.microsoft.com l mt a ch URL tuyt i. URL tng i l mt URL c mt hoc nhiu phn b thiu. Trnh duyt ly thng tin b thiu t trang cha URL . V d, nu giao thc b thiu, trnh duyt s dng giao thc ca trang hin thi.2.5.1.2 S dng siu lin ktTh c s dng xc nh vn bn hay nh no s dng lm siu lin kt trong ti liu HTML. Thuc tnh HREF (tham chiu siu vn bn) c dng ch a ch hay URL ca ti liu hoc file c lin kt. C php ca HREF l: Hypertext Trong : Protocol: Giao thc. o http - giao thc truyn siu vn bn o telnet - m mt phin telnet o gopher - tm kim file o ftp - giao thc truyn file o mailto - gi th in t Host.domain: a ch Internet ca my ch Port: Cng phc v ca my ch ch Hypertext: Vn bn hay hnh nh m ngi dng cn nhp vo kch hot lin kt. Mt s giao thc thng dng l:a. Lin kt n nhng ti liu khc Gi s c hai ti liu HTML trn a cng cc b, Doc1.html v Doc2.html. on m sau to ra mt lin kt t Doc1.html n Doc2.html V d 2.18:HTML v JavaScriptTrang 32VIETHANITChng 2. Cc th c bn trong HTML Document 1 This page is all about creating links to documents. Click here to view document 2 Kt qu:Hnh 2.22: Lin kt n ti liu khc Khi ngi dng nhy n mt ti liu khc, bn nn cung cp cch quay tr li trang ch hoc nh hng n mt file khc. V d 2.19: Lien ket den tai lieu khac This is document 2. This page is displayed when you click the hyperlink in Document 1

Back home Kt qu:HTML v JavaScriptTrang 33VIETHANITChng 2. Cc th c bn trong HTMLHnh 2.23: Tr li trang trc Ch l cc lin kt c gch chn. Trnh duyt t ng gch chn cc lin kt. N cng thay i hnh dng con tr chut khi ngi s dng di chuyn chut vo lin kt. v d trn, cc file nm trong cng mt th mc, v vy ch cn ch ra tn file trong thng s HREF l . Tuy nhin, lin kt n cc file th mc khc, cn phi cung cp ng dn tuyt i hay ng dn tng i. ng dn tuyt i ch ra ng dn y t th mc gc n file. V d: C:\mydirectory\html\Doc2.html ng dn tng i ch ra v tr lin quan ca file vi v tr file hin ti. V d, nu th mc hin hnh l mydirectory th ng dn s l: Next page V vy, nu mun lin kt cc ti liu khng lin quan vi nhau th ta nn dng ng dn tuyt i. Tuy nhin, nu ta c mt nhm ti liu lin quan vi nhau, chng hn phn tr gip trong HTML, th ta nn s dng ng dn tng i cho cc ti liu trong nhm v ng dn tuyt i cho cc ti liu khng lin quan trc tip n ch . Khi , ngi dng c th ci t phn tr gip ny trong th mc mnh chn v n vn hot ng. b. Lin kt n cc phn trong cng mt ti liu Th neo (anchor) c s dng ngi dng c th nhy n nhng phn khc nhau ca mt ti liu. V d, bn c th hin th ni dung ca trang web nh mt lot cc lin kt. Khi ngi dng kch vo mt ti no th cc chi tit nm mt phn khc ca ti liu c hin th. Kiu lin kt ny c gi l named anchor bi v thuc tnh NAME c s dng to cc lin kt ny Topic name HTML v JavaScript Trang 34VIETHANITChng 2. Cc th c bn trong HTMLBn khng phi s dng bt k vn bn no nh du im neo. dng, ta s dng vch du (marker) trong thng s HREF nh sau: Topic name Du # trc tn ca siu lin kt bo cho trnh duyt bit rng lin kt ny lin kt n mt im c t tn trong ti liu. Khi khng c ti liu no c ch ra trc k t #, trnh duyt hiu rng lin kt ny nm trong cng ti liu. V d 2.20: Lien ket DANH MC NHC CCH MNG t nc
Bi ca khng qun
Cho em c gi Lam Hng
m trng sn nh Bc
C gi m ng
Chic Gy Trng Sn
Gii Phng Min Nam
Tin V Si Gn
Bi Ca May o
Cho em c gi Lam Hng
Xe ta bon trn nhng dm ng,
Gia lng qu ta bng qua bao sui o i nng
M xe ta bon ra chin trng
Cho em c gi Lam Hng
Gia ting bom go n di, vn nghe vang vang cu h trn ng
Nim vui ln to lan trn qu ta
i thng ng nhng chuyn xe ta bng bng qua
Hng Lnh i, nh cao my ngn // Tng t vi li cc bi ht khc Kt qu:HTML v JavaScriptTrang 35VIETHANITChng 2. Cc th c bn trong HTMLHnh 2.24.1: Lin kt n cc phn trong cng mt ti liuHnh 2.24.2: Lin kt n cc phn trong cng mt ti liu c. Lin kt n mt im xc nh mt ti liu khc By gi chng ta bit cch s dng cc vch du trong cng mt ti liu, hy th nhy n mt v tr trn mt ti liu khc. nhy n mt im trn ti liu khc, chng ta cn phi ch ra tn ca ti liu khi chng ta to vch du. Trc tin trnh duyt s c tn ti liu v m ti liu . Sau n s c vch du v di chuyn n im c nh du.HTML v JavaScriptTrang 36VIETHANIT V d 2.21: Lien ket Chng 2. Cc th c bn trong HTMLDANH MC NHC CCH MNG t nc
Bi ca khng qun
Cho em c gi Lam Hng
m trng sn nh Bc
C gi m ng
Chic Gy Trng Sn
Gii Phng Min Nam
Tin V Si Gn
Bi Ca May o
Kt qu:Hnh 2.25.1: Lin kt n mt im xc nh mt ti liu khcHTML v JavaScriptTrang 37VIETHANITChng 2. Cc th c bn trong HTMLHnh 2.25.2: Lin kt n mt im xc nh mt ti liu khc d. S dng email Nu mun ngi s dng gi c email, chng ta c th a mt c tnh vo trong trang web v cho php h gi email t trnh duyt. Tt c nhng g chng ta cn lm l chn gi tr mailto vo trong th lin kt. 2.5.2Th MetaPhn tiu cng c th cha phn t META. Phn t ny cung cp thng tin v trang web ca bn. N gm tn tc gi, tn phn mm dng vit trang , tn cng ty, thng tin lin lc, Phn t META s dng kt hp gia thuc tnh v gi tr. V d, ch Graham Browne l tc gi, ngi ta s dng phn t META nh sau:Tc gi ca ti liu l Graham Browne Thuc tnh http-equiv c th c s dng thay th thuc tnh name. My ch HTTP s dng thuc tnh ny to ra mt u p ng HTTP (HTTP response header). u p ng c truyn n trnh duyt nhn dng d liu. Nu trnh duyt hiu c u p ng ny, n s tin hnh cc hnh ng c bit i vi u p ng . V d:s sinh ra mt u p ng http nh sau :Expires: Mon, 15 Sep 2003 14 :25 :27 GMTHTML v JavaScriptTrang 38VIETHANITChng 2. Cc th c bn trong HTMLDo vy, nu ti liu lu li, HTTP s bit khi no truy xut mt bn sao ca ti liu tng ng.2.5.3Cc th DIV v SPANC nhng trng hp chng ta mun chia vn bn trong mt trang web thnh nhng khi thng tin logic. Chng ta cng c th p dng nhng thuc tnh thng thng cho ton b khi. Phn t DIV v SPAN c s dng nhm ni dung li vi nhau. Phn t DIV dng chia ti liu thnh cc phn c lin quan vi nhau. Phn t SPAN dng ch mt khong cc k t. Phn t SPAN dng nh ngha ni dung trong dng (in-line) cn phn t DIV dng nh ngha ni dung mc khi (block-level) V d 2.22: DIV va SPAN Division 1 The DIV element is used to group elements Typically, DIV is used for block level elements Division 2 This is a second division
Are you having fun? The second division is right aligned. Common formatting is applied to all the elements in the division Kt qu: HTML v JavaScript Trang 39VIETHANITChng 2. Cc th c bn trong HTMLHnh 2.26: Cc th DIV v SPAN2.5.4Cc th mc on2.5.4.1 Th Phn t c dng hin th cc thng tin nh tc gi, a ch, ch k trong ti liu HTML. Phn t ny c hin th cui trang v c th cha mt hoc mt s phn sau: Lin kt n trang ch c tnh chui tm kim Thng tin bn quyn V d 2.23: The ADDRESS My first HTML document This is going to be real fun Using another heading Another paragraph element Click here to visit Viet-Hans homepage HTML v JavaScriptTrang 40VIETHANIT Chng 2. Cc th c bn trong HTMLKt qu:Hnh 2.27: Minh ho th ADDRESS 2.5.4.2 Th Chng ta c th ch nh mt trch dn vn bn bn trong ti liu bng cch s dng phn t BLOCKQUOTE v Q. BLOCKQUOTE c s dng cho nhng phn trch dn di v c hin th nh mt on vn bn tht vo u dng. Nu phn trch dn ngn v khng cn ngt on th s dng phn t Q tt hn. Khi s dng phn t Q, bn phi xc nh du ngoc kp. V d 2.24: The BLOCKQUOTE The blockquote element is used to format the content in blocks of text. Humpty Dumpty sat on a wallHTML v JavaScriptTrang 41VIETHANITAll the Kings horses And all the Kings menChng 2. Cc th c bn trong HTMLHumpty Dumpty had a great fallCould not put Humpty Dumpty together again If you notice the content is rendered as a block of text Kt qu:Hnh 2.28: Minh ho th BLOCKQUOTE 2.5.4.3 Th Nu chng ta mun vn bn c hin th vi nh dng c xc nh trc, chng ta s dng phn t PRE. Phn t ny dng xc nh nh dng cho vn bn. Khi vn bn c hin th trong trnh duyt, n s tun theo tt c cc nh dng c xc nh trc trong m ngun ti liu HTML. V d 2.25: The PRE Humpty Dumpty sat on a wall Humpty Dumpty had a great fallHTML v JavaScriptTrang 42VIETHANITAll the Kings horses And all the Kings menChng 2. Cc th c bn trong HTMLCould not put Humpty Dumpty together again Kt qu:Hnh 2.29: Minh ho th PRE2.6 S dng k t c bit trong ti liu HTMLBn c th chn cc k t c bit vo vn bn ca ti liu HTML. m bo trnh duyt khng nhm chng vi th HTML, bn phi gn m nh dng cho cc k t c bit ny. K t c bit Ln hn (>) Nh hn ( Ho Nguyn Vn Anh 7 8 9 Trn Thu Linh 6 8 6 Kt qu: HTML v JavaScript Trang 58VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tinHnh 3.7: S dng hnh nh lm nn cho bng3.2 Lm vic vi biu muForm HTML l mt phn ca ti liu, n cha cc phn t c bit gi l cc iu khin. Cc iu khin c s dng nhp thng tin t ngi dng v cung cp mt s tng tc. D liu do ngi dng nhp vo c th c xc nhn hp l nh cc kch bn pha my khch (client-side scripts) v c chuyn n my ch x l thm.3.2.1S dng biu muVic s dng biu mu trn World Wide Web l kh nhiu v lin tc tng ln. Sau y l mt s cch s dng thng thng: Thu thp tn, a ch, s in thoi, a ch email v cc thng tin khc ngi dng ng k cho mt dch v hay mt s kin no .Thu thp thng tin dng ng k mua mt mt hng no , v d: Khi mun mua mt cun sch trn Internet, ta phi in tn, a ch gi th, phng thc thanh ton v cc thng tin lin quan khc. Thu thp thng tin phn hi v mt website. Hu ht cc site cung cp mt dch v no u khuyn khch khch hng gi thng tin phn hi. Ngoi vic xy dng mi quan h vi khch hng, y cn l mt ngun thng tin trao i hoc ci tin dch v. Cung cp cng c tm kim cho website. Cc site cung cp nhiu thng tin khc nhau thng cung cp cho ngi dng hp tm kim cho php h tm kim thng tin nhanh hn. Mt biu mu in hnh trn trang web nh sau:3.2.2Phn t FORMPhn t c s dng to mt vng trn trang nh mt biu mu. N ch ra cch b tr ca biu mu. Cc thuc tnh ca th ny bao gm:HTML v JavaScriptTrang 59VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tin Bng 3.6: Cc thuc tnh ca th Thuc tnh ACCEPTM t Thuc tnh ny xc nh danh sch cc kiu MIME c my ch nhn ra, trong c cha kch bn (script) x l biu mu. C php: ACCEPT = Internet media type Thuc tnh ny xc nh v tr ca script s x l biu mu hon chnh v c gi i. C php: ACTION = URL Thuc tnh ny xc nh phng thc d liu c gi n my ch. N cng xc nh giao thc c s dng khi my khch gi d liu ln cho my ch. Nu gi tr l GET th trnh duyt s to mt cu hi c cha a ch URL ca trang, mt du chm hi v cc gi tr do biu mu to ra. Trnh duyt s tr li cu hi cho kch bn c xc nh trong URL x l. Nu gi tr l POST, th d liu trn biu mu c gi n kch bn x l nh mt khi d liu. Ngi ta khng s dng chui cu hi. C php: METHOD = (GET | POST)ACTION METHODV d: a mt biu mu n chng trnh x l biu mu s dng theo phng thc POST ta vit nh sau: form contents 3.2.3Cc phn t nhp ca HTMLKhi to ra mt biu mu, ta c th t cc iu khin ln biu mu nhn d liu nhp vo t ngi dng. Cc iu khin ny c s dng vi phn t . Tuy nhin, ta cng c th s dng chng bn ngoi biu mu to cc giao din ngi dng.3.2.3.1 Phn t INPUTPhn t xc nh loi v s xut hin ca iu khin trn biu mu. Cc thuc tnh ca phn t ny l: Bng 3.7: Cc thuc tnh ca th Thuc tnh TYPE M t Thuc tnh ny xc nh loi phn t. Ta c th chn mt trong cc la chn: TEXT, PASSWORD, CHECKBOX, RADIO, SUBMIT, RESET, FILE, HIDDEN v BUTTON. Mc nh l TEXT. Thuc tnh ny ch tn ca iu khin. V d, nu c nhiu Trang 60NAME HTML v JavaScriptVIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tin hp vn bn (text box) trn mt biu mu th bn nn s dng tn xc nh chng TEXT1, TEXT2 hoc bt k tn no mnh chn. Phm vi hot ng ca thuc tnh NAME nm trong phn t FORM.VALUEy l thuc tnh tu chn, n xc nh gi tr khi to ca iu khin. Tuy nhin, i vi kiu (TYPE) l RADIO th ta phi xc nh cho n mt gt. Thuc tnh ny xc nh rng ban u ca iu khin. i vi kiu l TEXT hay PASSWORD th kch thc c xc nh theo k t. i vi cc loi phn t nhp khc, rng c xc nh bng im (pixels)SIZEMAXLENGTH Thuc tnh ny c s dng xc nh s k t ln nht c th nhp vo phn t TEXT hoc PASSWORD. Mc nh l khng gii hn. CHECKED y l thuc tnh logic xc nh nt c c chn hay khng. Thuc tnh ny c s dng khi kiu nhp l RADIO hay CHECKBOX. SRC = URL. Thuc tnh ny c dng khi ta mun s dng mt nh trong kiu INPUT. N xc nh v tr ca nh.SRCPhn ny ta s tho lun v cc loi phn t nhp cng vi mt s c tnh v s kin thng dng.3.2.3.2 ButtonPhn t ny to ra mt iu khin nt (button) Bng 3.7: Cc thuc tnh ca i tng INPUT cho phn t Button Thuc tnh NAME SIZE TYPE VALUE3.2.3.3 TextboxM t Thit lp hoc truy xut tn ca iu khin Thit lp hoc truy xut kch thc ca iu khin c biu din bi Thit lp hoc truy xut gi tr ca ntPhn t ny to ra mt iu khin nhp vn bn trn mt dng. Thuc tnh SIZE xc nh s k t c th hin th trong phn t. Thuc tnh MAXLENGTH xc nh s k t ti a c th nhp vo phn t ny. Chng hn:Gi tr VALUE y hin th ni dung ban u ca vn bn v truy xut vn bn khi biu mu c gi i.3.2.3.4 CheckboxHTML v JavaScriptTrang 61VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tinPhn t ny to ra mt iu khin checkbox. Ngi dng c th chn mt hoc nhiu checkbox. Khi mt phn t checkbox c chn, th cp tn/gi tr c nhn cng vi biu mu. Gi tr mc nh ca checkbox l bt (on). Phn t checkbox l mt phn t trn dng v khng cn th ng. Bng 3.7: Cc thuc tnh ca i tng INPUT cho phn t Checkbox Thuc tnh NAME SIZE TYPE VALUE STATUS CHECKED3.2.3.5 RadioM t Thit lp hoc truy xut tn ca iu khin Thit lp hoc truy xut kch thc ca iu khin c biu din bi Thit lp hoc truy xut gi tr ca checkbox Thit lp hoc truy xut trng thi xem checkbox c c chn hay khng. Thit lp hoc truy xut trng thi ca checkboxPhn t ny to ra iu khin nt radio. Mt iu khin kiu nt radio (radio button control) c s dng i vi cc tp gi tr loi tr ln nhau. Cc iu khin radio trong mt nhm phi c cng tn. Vo mt thi im, ngi dng ch c th chn mt la chn. Ch c nt radio c chn trong nhm mi to nn cp NAME/VALUE trong d liu c nhn. Cc nt radio nn t thuc tnh VALUE. Bng 3.8: Cc thuc tnh ca i tng INPUT cho phn t Radio Thuc tnh NAME SIZE TYPE VALUE STATUS CHECKED Chng hn: Male 3.2.3.6 SubmitM t Thit lp hoc truy xut tn ca iu khin Thit lp hoc truy xut kch thc ca iu khin c biu din bi Thit lp hoc truy xut gi tr ca radio Thit lp hoc truy xut trng thi xem nt radio c c chn hay khng. Thit lp hoc truy xut trng thi ca nt radio.Phn t ny to ra mt nt Submit. Khi ngi dng nhp vo nt ny, biu mu c chuyn n v tr c xc nh trong thuc tnh ACTION. Cp tn/gi tr ca nt Submit c nhn cng vi biu mu. Chng hn:HTML v JavaScriptTrang 62VIETHANIT3.2.3.7 nhChng 3. Lm vic vi bng, biu mu, khung v a phng tinPhn t ny to ra mt nt submit dng nh. Gi tr ca thuc tnh SRC xc nh URL ca nh c t trong nt y. Khi ngi dng nhp vo iu khin nh ny, biu mu c chuyn i x l. To x v y (c o bng im) ti v tr nhp chut c chuyn n my ch vi nh dng sau: Name.x = valueofx Name.y = valueofy Trong , name l tn ca iu khin. Ta c th s dng nhiu nt Submit vi cc hnh nh khc nhau thay v mt nt Submit ch c mt hnh. Nu cn trnh by nhiu nh ta c th s dng bn nh. Chng hn: 3.2.3.8 ResetPhn t ny to ra nt reset. Khi ngi dng nhp vo nt ny, cc gi tr ca tt c cc iu khin c ti thit lp tr v gi tr ban u, c xc nh trong cc gi tr thuc tnh ca chng. Chng hn: V d 3.7: Chng trnh sau th hin vic s dng nhiu kiu nhp khc nhau Sample form Sample Stock Survey Describe your investment experience Beginner Intermediate Expert Types of Investments you make HTML v JavaScriptTrang 63VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tin Individual Stocks Options Mutual Funds
What is your stock pick for this year? Kt qu:Hnh 3.8: Minh ho mt s phn t trong biu mu3.2.3.9 Phn t TextAreaHTML v JavaScriptTrang 64VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tinPhn t ny to ra mt iu khin nhp vn bn trn nhiu dng so vi hp vn bn nhp mt dng. Ta phi xc nh kch thc ca TextArea. Ta cng phi xc nh s dng, s ct trong TextArea. Tuy nhin, ta phi kt thc phn t vi th ng Bng 3.9: Cc thuc tnh ca phn t TextArea Thuc tnh COLS ROWS SIZE TYPE VALUE Chng hn: 3.2.3.10M t Truy xut rng ca TextArea Thit lp hoc truy xut s hng ngang trong Thit lp hoc truy xut kch thc ca iu khin Truy xut loi iu khin, s dng gi tr Thit lp hoc truy xut gi tr ca TEXTAREAPhn t BUTTONPhn t ny to ra iu khin Button. Khi ngi dng nhp vo nt Submit, biu mu c nhn x l. Cp tn/gi tr ca nt submit c nhn cng vi biu mu. Bng 3.10: Cc thuc tnh ca phn t Button Thuc tnh NAME VALUE TYPE Gn tn cho nt Gn gi tr cho nt Xc nh loi nt. Cc gi tr c th l: Submit - to nt nhn biu mu khi c nhp vo Button - to nt kch hot mt script khi c kch vo - Reset - To nt thit lp li (Reset) biu mu v cc gi tr ca cc iu khin trong biu mu. Mt nt (BUTTON) c hai loi l submit (type = submit) ging nh mt phn t INPUT ca loi nt. S khc nhau ch khi phn t BUTTON c nhp vo th cp tn/gi tr c nhn cng biu mu. Mt nt c loi l submit cng cha mt nh v ging mt phn t INPUT c loi l nh. S khc nhau ch phn t INPUT c dng mt nh phng trong khi phn t BUTTON th hin th nh mt nt c hiu ng ln/xung khi nhp vo. V d 3.8: Chng trnh sau minh ho cho vic s dng phn t TEXTAREA v BUTTONM tHTML v JavaScriptTrang 65VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tin Sample form Sample Stock Survey Any Investment Advice for others? Send Reset Kt qu:HTML v JavaScriptTrang 66VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tinHnh 3.9: Minh ho phn t TEXTAREA v BUTTON3.2.3.11Phn t SelectPhn t SELECT c s dng hin th mt danh sch cc la chn cho ngi dng. Mi la chn c biu din bi phn t OPTION. Mt phn t SELECT phi cha t nht mt phn t OPTION. Thnh phn c chn la s hin th vi mu khc so vi cc thnh phn cn li. Bng 3.11: Cc thuc tnh ca phn t SELECT Thuc tnh NAME M t Gn tn cho phn t. Khi biu mu c gi i, thuc tnh tn c gn vi gi tr chn la. Nu c nhiu s chn la, ngi dng s dng chc nng cun, thuc tnh ny xc nh s dng trong danh sch c hin th L thuc tnh logic cho php ngi dng chn mt hoc nhiu chn la.SIZE MULTIPLEMi la chn trong hp chn c ly gi tr thng qua vn bn m t ca n, xem n c c chn hay khng. Mng OPTION c to ra theo danh sch la chn trong phn t SELECT. Mi la chn c thuc tnh Text v Selected cho php chng ta kim tra tu chn c c chn hay khng v truy xut vn bn ca la chn theo th t. By gi ta c th kim tra mi phn t trong mng v xc nhn n. HTML v JavaScript Trang 67VIETHANIT V d 3.9: Chng 3. Lm vic vi bng, biu mu, khung v a phng tin Sample form Sample Stock Survey How do you buy your stocks? 1. Online 2. Touch Tone Trading 3. Broker Assisted Other


Kt qu:HTML v JavaScriptTrang 68VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tinHnh 3.10: Minh ho phn t SELECT Phn t OPTGROUP c s dng nhm cc la chn vo mt cy phn cp. V d, bng ni dung c th c tn cc chng. Cc ch v ch con trong mt chng c th c nhm vo chng . Bng 3.12: Cc thuc tnh ca phn t OPTGROUP Thuc tnh SELECTED VALUE LABEL V d 3.10: Using the Option Group Introduction to HTMLM t y l thuc tnh logic s dng chn trc mt tu chn. Xc nh gi tr c nhn vo cho tu chn c chn. Gi tr ny c gn vi tn ca phn t SELECT. Ni dung ca phn t OPTION l gi tr mc nh. Xc nh vn bn hin th cho mt tu chn.HTML v JavaScriptTrang 69VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tin Introduction to Web page designing Introduction to Visual Basic Vissual Basic Application Development Kt qu:Hnh 3.11: Minh ho phn t OPTGROUP3.2.3.12Phn t LABELPhn t LABEl c s dng gn thng tin vo cc phn t iu khin. V d, phn t TEXT khng c nhn xc nh r n. Ta c th gn nhn vo phn t TEXT khi trang hin th. Ta phi xc nh thuc tnh ID ca iu khin m n c gn vo. V d 3.11: HTML v JavaScriptTrang 70VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tin Using Label Personal Information First name:

Last name:

Kt qu:Hnh 3.12: Minh ho phn t LABEL3.2.4To biu muHTML v JavaScriptTrang 71VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tinChng ta tho lun v phn t v cc iu khin c th thm vo biu mu nhn thng tin ngi dng. Trong phn ny, chng ta s to mt biu mu nhn thng tin v mt ngi xin vic. Cc nt RESET v SUBMIT thc hin cc cng vic cn thit. V d 3.12: Job application Application Form
Name:
Area of Interest

Web Designer NAME=CONTROL1 VALUE=0 Web Administrator Web Developer Experience None 1 year 2 years 3 years
Comments
Type your comments here HTML v JavaScriptTrang 72VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tin
Send acknowledgement
TYPE=CHECKBOX Kt qu:Hnh 3.13: V d mt biu mu n xin vic Khi c nhiu phn t trong mt form, chng ta cn phi iu khin chng. Sau y l cc thuc tnh iu khin cc phn t.3.2.4.1 Thit lp tiu im (Focus)HTML v JavaScriptTrang 73VIETHANITChng 3. Lm vic vi bng, biu mu, khung v a phng tinMt phn t tr thnh hot ng khi n nhn tiu im. V d, nhp vn bn vo phn t TEXT, tiu im phi nm trn phn t . Khi phn t mt tiu im, n s khng hot ng na. Cch n gin nht t tiu im cho phn t l ta kch vo n bng cch s dng chutm joystick hoc dng bn phm t.3.2.4.2 Th t tabThuc tnh tabindex ca mt phn t xc nh trnh t phn t nhn tiu im thng qua bn phm. y bao gm cc phn t c lng vo cc phn t khc. Gi tr c th l bt c s no gia 0 v 32767. Tiu im bt u t phn t c gi tr tabindex thp nht. Nu ta gn cng mt gi tr tabindex cho hn mt phn t, th cc phn t nhn tiu im theo th t n xut hin trong ti liu. Nu phn t no khng h tr thuc tnh tabindex, n s l phn t nhn tiu im cui cng. Nu ta v hiu ho mt phn t, n s khng c lit k vo th t tab v n s khng nhn c tiu im. Chng hn: Web Designer 3.2.4.3 Phm truy cp (Access Keys)Thuc tnh ny c s dng gn phm truy cp cho phn t. Phm truy cp l mt k t v thng c s dng cng vi phm ALT. Khi ngi dng nhn phm truy cp, phn t c xc nh s nhn tiu im v bt u hot ng. Chng hn: Name: for a non-frames version here