HTML 2006 Jan 20

ӪY BAN NHÂN DÂN THÀNH PHӔ HÀ NӜI
SӢ BƯU CHÍNH VIӈN THÔNG HÀ NӜI
GIÁO TRÌNH
HTML VÀ THIӂT Kӂ WEBSITE
(Mã sӕ giáo trình: 3CI3)
HÀ NӜI. 2005
LͤI Mͦ Đ̮U
Ngôn ngͷ Siêu văn b̫n HTML (yper ext Markup Language) là ngôn ngͷ
bi͋u di͍n văn b̫n cho phép ta đưa vào m͡t văn b̫n nhi͉u thu͡c tính c̯n thi͇t đ͋
có th͋ truy͉n thông qu̫ng bá trên m̩ng toàn cͭc WWW (World Wide Web). HTML
cho phép ta đưa hình ̫nh đ͛ h͕a vào văn b̫n, thay đ͝i cách bày trí cͯa văn b̫n,
và t̩o nhͷng tài li͏u siêu văn b̫n có kh̫ năng đ͙i tho̩i tương tác vͣi ngưͥi dùng.
HTML chͯ y͇u xoay quanh khái ni͏m ³th̓´ (tag) làm n͉n t̫ng. M͡t ví dͭ v͉
tag là . H̯u h͇t các chͱc năng trên HTML có th̓ mͧ và th̓ đóng t̩o thành
m͡t c̿p giͣi h̩n m͡t đo̩n văn b̫n. Ví dͭ và là th̓ ³bold´ nghĩa là
chͷ béo. Toàn b͡ đo̩n văn b̫n giͷa và sͅ đưͫc th͋ hi͏n dưͣi d̩ng chͷ
béo (hay chͷ đ̵m) khi văn b̫n đó đưͫc xem b̹ng m͡t trình duy͏t tương ͱng. Ví dͭ
 xin chào sͅ đưͫc hi͏n lên là xin chào.
Đ͋ t̩o m͡t siêu văn b̫n, ta có th͋ dùng b̭t cͱ m͡t chương trình so̩n th̫o
nào (ví dͭ: NC-Norton Commander, EDIT - cͯa DOS, NotePad hay Write - cͯa
Windows 3.x, WordPad cͯa Win95, WinWord 2.0 hay 6.0, FoxPro, Borland C++
IDE, Borland Pascal IDE, FrontPage, TextPad, v.v«), ch͑ c̯n n̷m đưͫc các th̓
cͯa HTML, và khi ghi vào đĩa thì c̯n lưu dưͣi d̩ng file text. Tên file có đuôi mͧ
r͡ng là HTM (ho̿c HTML). Song có m͡t h̩n ch͇ là d̩ng văn b̫n khi ta so̩n vͣi
khi ta xem sau này (trên WWW) không gi͙ng nhau. Chính vì lͅ đó mà nhi͉u hãng
tung ra ph̯n m͉m so̩n siêu văn b̫n What You See Is What You Get (WYSIWYG-
cái ta th̭y cũng là cái ta có đưͫc). Hãng Microsoft cũng đã tung ra m͡t ti͏n ích
đưͫc s͵ dͭng r͡ng rãi. Ngoài ra, còn có nhi͉u ti͏n ích chuy͋n đ͝i tͳ d̩ng RTF (có
th͋ so̩n b̹ng WinWord hay WordPad) sang HTML, hay các phiên b̫n sau này
cͯa trình duy͏t Web như NetScape có s̽n luôn chͱc năng này. Các ti͏n ích đó đ͉u
gi͙ng nhau ͧ ch͟ cho phép ta gõ tr͹c ti͇p các th̓ vào văn b̫n nhưng cũng có th͋
dùng t͝ hͫp cͯa thanh công cͭ (toolbar), h͡p tho̩i (dialog), th͹c đơn (menu) hay
danh sách các l͹a ch͕n (pop-up list). Đ͋ g̩ch dưͣi đo̩n văn b̫n trong ví dͭ vͳa
r͛i, ta có th͋ gõ vào xin chào, dùng chu͡t ch͕n, r͛i b̭m vào nút Underline trên
thanh công cͭ. Văn b̫n sͅ t͹ đ͡ng đưͫc chuy͋n thành xin chào (ͧ đây
thì và là c̿p mͧ/đóng cͯa tag có chͱc năng giͣi h̩n đo̩n văn b̫n c̯n
đưͫc g̩ch dưͣi).
1
Ngày nay, do s͹ phát tri͋n như thác lũ cͯa m̩ng toàn cͭc, HTML cũng ngày
càng trͧ nên phͱc t̩p và hoàn thi͏n hơn đ͋ đáp ͱng đưͫc nhͷng yêu c̯u mͣi n̫y
sinh trong quá trình phát tri͋n đó (như âm thanh, hình ̫nh đ͡ng, v.v«). Ngưͥi ta
g͕i đó là nhͷng phiên b̫n cͯa HTML và đánh s͙ đ͋ bi͋u th͓. HTML 2, HTML 2+,
HTML 3,« là đ͋ ch͑ nhͷng phiên b̫n sau này.
M͡t trong nhͷng đi͋m m̩nh cͯa HTML là m͡t văn b̫n b̭t kǤ n͇u tuân thͯ
tiêu chu̱n HTML đ͉u có th͋ hi͏n lên màn hình hay in ra, tóm l̩i là hi͋u đưͫc, bͧi
b̭t kǤ lo̩i ph̯n m͉m hay máy tính nào mà ngưͥi đ͕c có, không phân bi͏t trình
duy͏t nào (NetScape trên Windows hay Lynx trên UNIX, th̵m chí cho ngưͥi khi͇m
th͓ b̹ng ph̯n m͉m đ̿c bi͏t).
Ngưͥi ta còn đang tranh cãi nhi͉u trên Internet v͉ HTML ³t͙t´. Đ͓nh hưͣng
nguyên thͯy cͯa HTML là t̩o ra m͡t phương pháp v̩n năng đ͋ lưu giͷ và th͋ hi͏n
thông tin. Sau này ngưͥi ta coi HTML như m͡t ngôn ngͷ đ͓nh hưͣng n͡i dung ±
³trong tài li͏u có gì´ quan tr͕ng hơn nhi͉u so vͣi ³tài li͏u có đ́p không´.
Tác gi̫ r̭t mong nh̵n đưͫc s͹ góp ý tͳ b̩n đ͕c
Xin chân thành c̫m ơn.
2
-p Tên môn hӑc: HTML VÀ THIӂT Kӂ WEB
-p r sӕ môn hӑc: 3CI3
-p Thӡi gian: Lý thuyӃt + thӵc hành 45T
-p rc tiêu: Cung cҩp cho hӑc viên các kiӃn thӭc cơ bҧn liên quan đӃn ngôn
ngӳ HTrL và thiӃt kӃ Web.
-p Nhӳng kiӃn thӭc cҫn phҧi đưӧc trang bӏ trưӟc khi hӑc: Có kiӃn thӭc vӅ sӱ
dng máy tính.
-p Nӝi dung môn hӑc:
Rhương I: NHӲNG KHÁI NIӊM R SӢ.
Rhương II: TRÌNH BÀY TRANG.
Rhương III: DANH SÁRH VÀ BҦNG TRONG HTML.
Rhương IV: ĐƯA HÌNH ҦNH VÀO TÀI LIӊU HTML.
Rhương V: RÁR MӔI LIÊN KӂT SIÊU VĂN BҦN.
Rhương VI: BÀY TRÍ NӄN VÀ KHUNG.
Rhương VII: BIӆU MҮU STYLE VÀ RASRADING STYLE SHEET.
Rhương VIII: RNG R SOҤN THҦO TRӴR QUAN WEB (Microsoft
FrontPage 2003)
-p Òӕi tưӧng hӑc: Nhӳng ngưӡi cҫn biӃt các kiӃn thӭc cơ bҧn vӅ HTrL và
Website đӇ thiӃt kӃ Website tĩnh.
-p Biên soҥn: Bӝ môn Các hӋ thӕng thông tin, Khoa Công nghӋ thông tin,
Trưӡng ÒH Công NghӋ, ÒHQGHN.
3
MR LR
LӠI MӢ ĐҪU 1
RHƯ NG I. NHӲNG KHÁI NIӊM R SӢ ....................................................... 9
I.1. World Wide Web là gì? ............................................................................... 9
I.2. HTML là gì? .............................................................................................. 12
I.3. Rác đһc điӇm cӫa siêu văn bҧn ................................................................. 13
I.3.1. Òӝc lұp vӟi phҫn cӭng và phҫn mӅm ..................................................... 13
I.3.2. Òӝc lұp vӟi khái niӋm trang và thӭ tӵ các trang..................................... 14
I.3.3. Website và trang chӫ - homepage .......................................................... 14
I.4. Soҥn thҧo văn bҧn - nhӳng vҩn đӅ chung ................................................ 15
I.4.1. Trang m nguӗn HTrL và trang Web................................................... 15
I.4.2. Các thҿ HTrL ...................................................................................... 16
I.4.3. Các quy tҳc chung ................................................................................. 17
I.4.4. Cҩu trúc cӫa mӝt tài liӋu HTrL ............................................................ 18
I.4.5. Các phҫn tӱ HTrL (HTrL element).................................................... 19
Bài tұp ............................................................................................................... 19
RHƯ NG II. TRÌNH BÀY TRANG ................................................................. 20
II.1. Tҥo tiêu đӅ ................................................................................................ 20
II.2. Thҿ trình bày trang .................................................................................. 21
II.2.1. rӝt sӕ thҿ chính ................................................................................... 21
II.2.2. Các thuӝc tính cӫa thҿ trình bày trang .................................................. 25
Bài tұp ............................................................................................................... 27
RHƯ NG III. DANH SÁRH VÀ BҦNG TRONG HTML............................... 28
III.1. Rác kiӇu danh sách ................................................................................. 28
III.1.1. Danh sách không đánh sӕ thӭ tӵ ......................................................... 28
III.1.2. Danh sách đánh sӕ thӭ tӵ .................................................................... 29
III.1.3. Danh sách các đӏnh nghĩa .................................................................... 31
III.1.4. Danh sách phӕi hӧp, lӗng nhau ........................................................... 31
4
III.2. Bҧng biӇu ................................................................................................ 32
III.2.1. Khung cҩu trúc .................................................................................... 32
III.2.2. rӝt sӕ lưu ý vӅ bҧng........................................................................... 33
III.2.3. Các ví d ............................................................................................. 37
Bài tұp ............................................................................................................... 40
RHƯ NG IV. ĐƯA HÌNH ҦNH VÀO TÀI LIӊU HTML .............................. 41
IV.1. Hình ҧnh tĩnh .......................................................................................... 41
IV.1.1. TӋp ҧnh ............................................................................................... 41
IV.1.2. Thҿ <IrG«>..................................................................................... 41
IV.2. Rác thuӝc tính cӫa thҿ chèn hình ҧnh.................................................... 41
IV.2.1. Thuӝc tính ALT .................................................................................. 41
IV.2.2. Thuӝc tính WIDTH và HEIGHT ........................................................ 42
IV.2.3. Thuӝc tính ALIGN ............................................................................. 43
IV.2.4. Thuӝc tính VSPACE và HSPACE ...................................................... 43
Bài tұp ............................................................................................................... 44
RHƯ NG V. RÁR MӔI LIÊN KӂT SIÊU VĂN BҦN..................................... 45
V.1. Thҿ neo và mӕi liên kӃt ............................................................................ 45
V.1.1. Thuӝc tính HREF ................................................................................. 45
V.1.2. Liên kӃt ra ngoài ± External Links ....................................................... 45
V.1.3. Òӏa chӍ tuyӋt đӕi ................................................................................... 46
V.1.4. Òӏa chӍ tương đӕi ................................................................................. 46
V.1.5. Liên kӃt nӝi tҥi ± Internal Link ............................................................. 46
V.2. Dùng hình ҧnh làm đҫu mӕi liên kӃt ....................................................... 47
V.2.1. Thay chӳ bҵng hình.............................................................................. 47
V.2.2. Image rap - thҿ AREA ....................................................................... 47
V.3. Đưa âm thanh vào tài liӋu ........................................................................ 48
V.3.1. Liên kӃt đӃn tӋp âm thanh .................................................................... 48
V.3.2. Tҥo âm thanh nӅn ................................................................................. 48
5
V.4. Đưa Video vào tài liӋu .............................................................................. 49
V.4.1. Chèn tӋp Video .................................................................................... 49
V.4.2. Nhúng tӋp video ................................................................................... 49
Bài tұp ............................................................................................................... 50
RHƯ NG VI. BÀY TRÍ NӄN VÀ KHUNG ..................................................... 51
VI.1. Màu nӅn và văn bҧn ............................................................................... 51
VI.1.1. Ò t màu nӅn........................................................................................ 51
VI.1.2. ràu chӳ cӫa văn bҧn .......................................................................... 51
VI.1.3. ràu cӫa đҫu mӕi liên kӃt - Thuӝc tính LINK, VLINK và ALINK...... 51
VI.1.4. Thuӝc tính và m màu ........................................................................ 52
VI.2. Nҥp hình ҧnh làm nӅn cho trang văn bҧn ............................................. 53
VI.2.1. Thuӝc tính BACKGROUND .............................................................. 53
VI.2.2. Water mark ......................................................................................... 53
VI.2.3. H y ký tên vào tài liӋu cӫa mình ......................................................... 54
VI.3. Khung ± Frames...................................................................................... 55
VI.3.1. Trang trí khung ................................................................................... 55
VI.3.2. Thành phҫn FRArESET .................................................................... 56
VI.4. ThiӃt lұp Target, thҿ NOFRAME và IFRAME .................................... 59
VI.4.1. ThiӃt lұp Target .................................................................................. 59
VI.4.2. Thҿ NOFRArES ............................................................................... 60
VI.4.2. Nhúng frame - thҿ IFRArE ............................................................... 60
Bài tұp ............................................................................................................... 61
RHƯ NG VII. BIӆU MҮU STYLE VÀ RASRADING STYLE SHEET ....... 62
VII.1. FORM .................................................................................................... 62
VII.1.1. FORr là gì?...................................................................................... 62
VII.1.2.Các thành phҫn trong FORr .............................................................. 63
VII.1.3. Thêm tính cҩu trúc cho FORr .......................................................... 70
VII.2. Rascading style sheet ............................................................................. 72
6
VII.2.1. Inline Style ........................................................................................ 72
VII.2.2. Giӟi thiӋu Style Sheet ........................................................................ 74
VII.2.3. Javascript Style Sheet ........................................................................ 75
VII.2.4. Thuұt ngӳ Style Sheet ....................................................................... 77
VII.2.5. Các chú thích trong Style Sheet ......................................................... 92
VII.2.6. Lӧi ích cӫa các Style Sheet ................................................................ 92
VII.2.7. KӃt hӧp Style Sheet vӟi HTrL ......................................................... 93
VII.2.8. Thӭ tӵ ưu tiên cӫa các style (Cascading) ........................................... 97
RHƯ NG VIII. RNG R SOҤN THҦO TRӴR QUAN WEB
(MIRROSOFT FRONTPAGE 2003) ............................................................... 100
VIII.1. Tҥo mӝt trang Web ............................................................................ 100
VIII.1.1. Bҳt đҫu sӱ dng FrontPage2003 ..................................................... 100
VIII.1.2. Tҥo mӝt trang tӯ mӝt template ....................................................... 101
VIII.1.3. Tҥo và lưu mӝt trang mӟi ............................................................... 102
VIII.1.4. Tҥo mӝt đӅ mc ............................................................................. 103
VIII.1.5. Chӑn font và màu ........................................................................... 104
VIII.2. Tә chӭc mӝt trang vӟi các liên kӃt, danh sách và bҧng ................... 107
VIII.2.1. Thêm mӝt hyperlink vào mӝt trang Web ........................................ 107
VIII.2.2. Tҥo mӝt danh sách ......................................................................... 110
VIII.2.3. Tә chӭc mӝt trang vӟi các bҧng ..................................................... 112
VIII.2.4. HiӇn thӏ hình ҧnh trên mӝt trang Web ............................................ 120
VIII.2.5. Tҥo mӝt Web site mӟi .................................................................... 133
VIII.2.5.Khai thác site mӟi ........................................................................... 135
VIII.3. Phát triӇn nhanh mӝt site vӟi các template ...................................... 142
VIII.3.1. Chӑn mӝt template Web site .......................................................... 143
VIII.3.2. Tҥo mӝt Web site mӟi .................................................................... 144
VIII.3.3. Tҥo tùy biӃn Web site mӟi cӫa ta ................................................... 145
VIII.3.4. Thêm và loҥi bӓ các lӡi chú thích ................................................... 146
7
VIII.3.5. Khai thác template Personal Web Site ............................................ 147
VIII.3.6. Thêm mӝt tem thӡi gian vào mӝt trang Web .................................. 148
VIII.3.7. Lưu các thay đәi sang mӝt site ....................................................... 149
VIII.4. Tҥo mӝt site vӟi sӵ trӧ giúp cӫa Wizard trong FrontPage 2003 ..... 150
VIII.4.1. r mӝt wizard tҥo site ................................................................... 150
VIII.4.2. Nhұp mӝt site hiӋn có vào FrontPage ............................................. 152
VIII.4.3. Chӑn mӝt phương pháp import ....................................................... 152
VIII.4.4. Chӑn vӏ trí đӇ lưu site ..................................................................... 155
VIII.4.5. Thu thұp thông tin phҧn hӗi tӯ các khách tham quan Web site cӫa ta
..................................................................................................................... 156
VIII.4.6. Lưu thông tin phҧn hӗi cӫa khách tham quan sang mӝt file ............ 158
VIII.4.7. Nhұn thông tin phҧn hӗi cӫa khách tham quan bҵng email ............. 160
Bài tұp ............................................................................................................. 161
BҦNG RÁR TӮ VIӂT TҲT ..............................................................................162
TÀI LIӊU THAM KHҦO...................................................................................163
8
CHƯƠNG I. NHӲNG KHÁI NIӊM CƠ SӢ
I.1. World Wide Web là gì?

World Wide Web (WWW) là mӝt mҥng các tài nguyên thông tin. WWW
dӵa trên 3 cơ chӃ đӇ các tài nguyên này tr nên sҹn dùng cho ngưӡi xem càng rӝng
r i nhҩt càng tӕt:
-p Cơ chӃ đ t tên cùng dҥng đӕi vӟi viӋc đӏnh dҥng các tài nguyên trên WWW
(như các URL)
-p Các giao thӭc, đӇ truy nhұp tӟi các tài nguyên qua WWW (như HTTP)
-p Siêu văn bҧn, đӇ dӉ dàng chuyӇn đәi giӳa các tài nguyên (như HTrL).
Các ràng buӝc giӳa ba cơ chӃ đưӧc nêu rõ dưӟi đây
p
Giӟi thiӋu vӅ URL:
rӑi tài nguyên sҹn dùng trên WWW ± tài liӋu HTrL, ҧnh, video clip,
chương trình,« - có mӝt đӏa chӍ mà có thӇ đưӧc m hóa bi mӝt URL.
Các URL thưӡng gӗm 3 phҫn:
-p ViӋc đ t tên cӫa các cơ chӃ dùng đӇ truy nhұp tài nguyên
-p Tên cӫa máy tính lưu trӳ (tә chӭc) tài nguyên
-p Tên cӫa bҧn thân tài nguyên, như mӝt đưӡng dүn
Ví d coi URL chӍ rõ trang W3C Technical Reports:
http://www.w3.org/TR
URL này có thӇ đưӧc đӑc như sau: Có mӝt tài liӋu sҹn dùng theo giao thӭc
HTTP, đang lưu trong máy www.w3.org, có thӇ truy nhұp theo đưӡng dүn ³/TR´.
Các cơ chӃ khác ta có thӇ thҩy trong các tài liӋu HTrL bao gӗm ³mailto´ đӕi vӟi
thư điӋn tӱ và ³ftp´ đӕi vӟi FTP.
Òây là mӝt ví d khác vӅ URL. Ví d này ám chӍ tӟi hӝp thư (mailbox) cӫa
ngưӡi dùng:
«.đây là văn bҥn «
Mӏi góp ý, xin gӯi thư tӝi
<A ref=´mailto:joe@someplace.com´>Joe Cool</A>
Các đӏnh danh đoҥn (fragment identifiers):
9
rӝt sӕ URL ám chӍ tӟi viӋc đӏnh vӏ mӝt tài nguyên. KiӇu này cӫa URL kӃt
thúc vӟi ³´ theo sau bi mӝt dҩu hiӋu kӃt nӕi (gӑi là các đ͓nh danh đo̩n). Ví d,
đây là mӝt URL đánh dҩu mӝt móc tên là section_2:
http://somesite.com/html/top.htmlsection_2
Các URL tương đӕi:

rӝt URL tương đӕi không theo cơ chӃ đ t tên. Òưӡng dүn cӫa nó thưӡng
tham chiӃu tӟi mӝt tài nguyên trên cùng mӝt máy như tài liӋu hiӋn tҥi. Các URL
tương đӕi có thӇ gӗm các thành phҫn đưӡng dүn tương đӕi (như ³..´ nghĩa là mӝt
mӭc trên trong cҩu trúc đưӧc đӏnh nghĩa bi đưӡng dүn), và có thӇ bao gӗm các
dҩu hiӋu đoҥn.
Các URL đưӧc giҧi quyӃt đӇ cho toàn các URL sӱ dng mӝt URL gӕc. Như
mӝt ví d cӫa giҧi pháp URL tương đӕi, giҧ sӱ chúng ta có URL gӕc
³http://www.acme.com/support/intro.html´. URL tương đӕi trong
đánh dҩu dưӟi đây cho mӝt liên kӃt siêu văn bҧn:
<A href=´suppliers.html´>Suppliers</A>
sӁ m rӝng thành URL đҫy đӫ
³http://www.acme.com/support/suppliers.html´ trong khi URL
tương đӕi trong viӋc đánh dҩu cho mӝt ҧnh dưӟi đây
<IMG src=´../icons/logo.gif´ alt=´logo´>
sӁ m rӝng thành URL đҫy đӫ ³http://www.acme.com/icons/logo.gif´
Trong HTrL, các URL đưӧc dùng đӇ:
-p Liên kӃt tӟi tài liӋu ho c tài nguyên khác, (xem A và LINK)
-p Liên kӃt tӟi kiӇu dҥng bên ngoài ho c kӏch bҧn (script) (xem INK và
SCRIPT)
-p Gӗm mӝt ҧnh, đӕi tưӧng, ho c applet trong mӝt trang, (xem IMG,
OBJECT, APPET và INPUT)
-p Tҥo mӝt bҧn dӗ ҧnh (xem MAP và AREA)
-p Tҥo mӝt form (xem ¼ORM)
-p Tҥo mӝt khung tài liӋu (xem ¼RAME và I¼RAME)
-p Trích dүn mӝt chӍ dүn bên ngoài (xem , BOCKUOTE, INS và DE)
-p Tham khҧo các quy ưӟc siêu dӳ liӋu mô tҧ mӝt tài liӋu (xem EAD)p
10
Ngày nay ngưӡi ta dùng máy tính như mӝt công c rҩt hӳu ích đӇ truy nhұp
Internet, chӫ yӃu là tìm kiӃm thông tin. Các thông tin này có thӇ là các văn bҧn,
hình ҧnh âm thanh hay thông tin đa phương tiӋn« Vӟi giao diӋn thân thiӋn bi
viӋc sӱ dng các ký hiӋu, biӇu tưӧng rҩt gӧi tҧ gҫn giӕng vӟi các hình ҧnh đӡi
thưӡng và chӍ cҫn nhӳng thao tác đơn giҧn ta đ có ngay thông tin cҫn tìm kiӃm
trưӟc m t.
Nhu cҫu sӱ dng máy tính đӇ truy cұp Internet tìm kiӃm thông tin ngày càng
nhiӅu và ngưӡi sӱ dng máy tính có trình đӝ tin hӑc và tiӃng Anh đӇ hiӇu các thông
báo cӫa máy khác nhau. Làm thӃ nào đӇ mӑi ngưӡi có thӇ dӉ dàng sӱ dng máy
tính đӇ truy cұp Internet như mӝt công c phc v đҳc lӵc cho viӋc tra cӭu tìm
kiӃm thông tin trên mҥng thông tin rӝng lӟn nhҩt toàn cc.
ViӋc này tr nên dӉ dàng hơn bi ý tưng siêu văn bҧn (Hypertext). Siêu văn
bҧn là các văn bҧn ³thông minh´ có thӇ giúp ngưӡi đӑc tìm và cung cҩp cho hӑ các
tài liӋu liên quan. Ngưӡi đӑc không phҧi mҩt công tìm kiӃm trong kho thông tin
Internet vô tұn.
Khái niӋm siêu văn bҧn do nhà tin hӑc Ted Nelson đӅ xuҩt vào năm 1965
như mӝt ưӟc mơ (³Computer Dreams´) vӅ khҧ năng cӫa máy tính trong tương lai.
Ông hy vӑng vӅ các máy tính có trí tuӋ như con ngưӡi, biӃt cách truy tìm các thông
tin cҫn thiӃt.
Dӵ án thӵc hiӋn siêu văn bҧn là cӫa mӝt kӻ sư trҿ ngưӡi Anh tên là Tim
Berners ± Lee. Sau khi tӕt nghiӋp Òҥi hӑc Oxfort (Anh) năm 1976, năm 1980 Tim
đ viӃt mӝt chương trình mô phӓng mӕi liên kӃt hai chiӅu bҩt kǤ trên mӝt đӗ thӏ
như kiӇu liên kӃt siêu văn bҧn. Năm 1989, trong khi làm viӋc tҥi ViӋn nghiên cӭu
kӻ thuұt hҥt nhân châu Âu (CERN) tҥi Berne (Thy sӻ), thҩy các đӗng nghiӋp rҩt
vҩt vҧ trong viӋc tra tài liӋu, Tim đ đưa ra mӝt đӅ án lưu trӳ siêu văn bҧn trên máy
tính sao cho dӉ dàng tìm kiӃm tài liӋu hơn.
Trong thӃ giӟi siêu văn bҧn WWW, ngưӡi sӱ dng có thӇ dӉ dàng đi tӯ tài
liӋu này sang tài liӋu khác thông qua các mӕi liên kӃt. Như vұy ta có thӇ du lӏch
trong xa lӝ thông tin phong phú trong khi vүn ngӗi tҥi nhà. Kӻ thuұt siêu văn bҧn
11
giúp cho ta không phҧi sang tұn Luvrơ Paris mà vүn có thӇ chiêm ngưӥng đưӧc
các kiӋt tác hӝi hӑa. Chính nó đ góp phҫn tҥo ra bưӟc phát triӇn bùng nә cӫa
Internet trong nhӳng năm gҫn đây.
I.2. HTML là gì?
ÒӇ phә biӃn thông tin trên toàn cc, cҫn mӝt ngôn ngӳ phә biӃn và dӉ hiӇu,
mӝt kiӇu viӋc phә biӃn tiӃng mҽ đҿ mà toàn bӝ các máy tính có thӇ hiӇu đưӧc.
Ngôn ngӳ phә biӃn dùng bi World Wide Web là HTrL (Hyper Text rarkup
Language).
HTrL cho tác giҧ các ý nghĩa đӇ:
Phә biӃn các tài liӋu trӵc tuyӃn vӟi các heading, văn bҧn, bҧng, danh sách,
ҧnh,..v.v«
Truy tìm thông tin trӵc tuyӃn theo các liên kӃt siêu văn bҧn bҵng viӋc kích
vào mӝt nút
ThiӃt kӃ các đӏnh dҥng cho viӋc kiӇm soát các giao dӏch (transaction) vӟi các
thiӃt bӏ tӯ xa, đӕi vӟi ngưӡi dùng trong viӋc tìm kiӃm thông tin, tҥo các sҧn phҭm,
đ t hàng,.v.v«
Bao gӗm spread-sheets, video clips, sound clips, và các ӭng dng trӵc tiӃp
khác trong các tài liӋu cӫa hӑ.
Các trang Web đҫy sinh đӝng mà bҥn thҩy trên World Wide Web là các trang
siêu văn bҧn đưӧc viӃt bҵng ngôn ngӳ đánh dҩu siêu văn bҧn hay HTML -
yper ext Markup Language. HTML cho phép b̩n t̩o ra các trang ph͙i hͫp hài
hòa văn b̫n thông thưͥng vͣi hình ̫nh, âm thanh, video, các m͙i liên k͇t đ͇n các
trang siêu văn b̫n khác...
Tên g͕i ngôn ngͷ dánh ḓu siêu văn b̫n ph̫n ánh đúng th͹c ch̭t cͯa công
cͭ này:
Đánh ḓu (Markup): HTML là ngôn ngͷ cͯa các th̓ đánh ḓu - Tag. Các
th̓ này xác đ͓nh cách thͱc trình bày đo̩n văn b̫n tương ͱng trên màn hình.
Ngôn ngͷ (Language): HTML là m͡t ngôn ngͷ tương t͹ như các ngôn ngͷ
l̵p trình, tuy nhiên đơn gi̫n hơn. Nó có cú pháp ch̿t chͅ đ͋ vi͇t các l͏nh th͹c
12
hi͏n vi͏c trình di͍n văn b̫n. Các tͳ khoá có ý nghĩa xác đ͓nh đưͫc c͡ng đ͛ng
Internet thͳa nh̵n và s͵ dͭng. Ví dͭ b = bold,p ul = unordered list,p ...
n b̫n ( ext): HTML đ̯u tiên và trưͣc h͇t là đ͋ trình bày văn b̫n và d͹a
trên n͉n t̫ng là m͡t văn b̫n. Các thành ph̯n khác như hình ̫nh, âm thanh, ho̩t
hình.. đ͉u ph̫i "c̷m neo" vào m͡t đo̩n văn b̫n nào đó.
Siêu v n b̫n (per): HTML cho phép liên k͇t nhi͉u trang văn b̫n r̫i rác
kh̷p nơi trên Internet. Nó có tác dͭng che ḓu s͹ phͱc t̩p cͯa Internet đ͙i vͣi
ngưͥi s͵ dͭng. Ngưͥi dùng Internet có th͋ đ͕c văn b̫n mà không c̯n bi͇t đ͇n văn
b̫n đó n̹m ͧ đâu, h͏ th͙ng đưͫc xây d͹ng phͱc t̩p như th͇ nào. HTML th͹c s͹
đã vưͫt ra ngoài khuôn kh͝ khái ni͏m văn b̫n c͝ đi͋n.
I.3. Các đһc điӇm cӫa siêu văn bҧn
I.3.1. Đͱc lͅp vͳi ph̿n c΁ng và ph̿n m͙m
HTML đ͡c l̵p vͣi ph̯n cͱng và ph̯n m͉m. rӝt tài liӋu HTrL đưӧc viӃt
bҵng mӝt phҫn mӅm soҥn thҧo c thӇ bҩt kǤ, trên mӝt máy c thӇ nào đó đӅu có thӇ
đӑc đưӧc trên bҩt kì mӝt hӋ thӕng tương thích nào.
ÒiӅu này có nghĩa là các tӋp siêu văn bҧn có thӇ đưӧc trình duyӋt hiӇn thӏ
trên rAC hay PC tùy ý mà không phҧi sӱa chӳa thay đәi gì. Sͧ dĩ có đưͫc tính
ch̭t này là vì các th̓ ch͑ di͍n đ̩t yêu c̯u c̯n ph̫i làm gì chͱ không cͭ th͋ c̯n
làm như th͇ nào.
Cũng vì lӁ đó mà bҥn không th͋ ch̷c ch̷n trang tài li͏u siêu văn b̫n cͯa
b̩n sͅ hi͏n lên màn hình chính xác là như th͇ nào vì còn tuǤ theo trình duy͏t th͋
hi͏n các thành ph̯n HTML ra sao.
Trong th͹c ti͍n, HTML ch͑ th͹c s͹ đ͡c l̵p đ͙i vͣi ph̯n cͱng, chưa hoàn
toàn đ͡c l̵p đ͙i vͣi ph̯n m͉m. ChӍ phҫn cӕt lõi là chuҭn hoá, còn các phҫn m
rӝng do tӯng nhà phát triӇn xây dӵng thì không hoàn toàn tương thích nhau.
13
I.3.2. Đͱc lͅp vͳi khái ni͟m trang và th΁ tΉ các trang
rӝt tính chҩt nӳa là HTrL đӝc lұp vӟi khái niӋm trang. Văn bҧn đưӧc trình
bày tùy theo kích thưӟc cӫa cӱa sә hiӇn thӏ: cӱa sә rӝng bӅ ngang thì sӁ thu ngҳn
hơn, cӱa sә hҽp bӅ ngang thì sӁ đưӧc kéo dài ra đӇ hiӇn thӏ cho hӃt nӝi dung. Òӝ
dài cӫa văn bҧn HTrL thӵc sӵ không bӏ hҥn chӃ.
I.3.3. Website và trang chͿ - homepage
rӝt website là mӝt bó các trang web liên kӃt

vӟi nhau và liên kӃt vӟi các trang bên ngoài
chҵng chӏt như mҥng nhӋn. Hàng triӋu Website
liên kӃt vӟi nhau tҥo thành World Wide Web ±
WWW
Có thӇ tưng tưӧng như mӝt ngӑn núi nhӓ các

trang web mӛi ngày mӝt cao thêm, đưӧc phát
triӇn bҵng cách thêm vào nhiӅu trang web lý thú
khác nӳa
Có thӇ minh hoҥ hình ҧnh cӫa mӝt website như

trong hình vӁ bên
Trang chӫ hay trang chính - 'home page' có thӇ

hiӇu là cӱa chính - 'front door' đӇ thâm nhұp vào
kho thông tin liên kӃt chҵng chӏt ҩy.
Vұy home page là trang web mà bӝ duyӋt sӁ m

ra đҫu tiên mӛi khi ngưӡi dùng bҳt đҫu thăm
website.
14
I.4. Soҥn thҧo văn bҧn - nhӳng vҩn đӅ chung
I.4.1. Trang mã nguͫn HTML và trang Web
Trang mã ngu͛n HTML là m͡t t͏p văn b̫n bình thưͥng g͛m các kí t͹ ASCII,
có th͋ đưͫc t̩o ra b̹ng b̭t cͱ trình so̩n th̫o thông thưͥng nào.
Theo quy ưͣc, ṱt c̫ các t͏p mã ngu͛n cͯa trang siêu văn b̫n ph̫i có đuôi
là .html ho̿c .htm.
Khi trình duy͏t (browser) đ͕c trang mã ngu͛n HTML, nó sͅ d͓ch các th̓
l͏nh và hi͋n th͓ lên màn hình máy tính thì ta thưͥng g͕i là trang Web. V̵y trang
web không t͛n t̩i trên đĩa cͱng cͯa máy tính cͭc b͡. Nó là cái th͋ hi͏n cͯa trang
mã ngu͛n qua vi͏c x͵ lý cͯa trình duy͏t. Như sau này ta sӁ thҩy, các trình duyӋt
khác nhau có thӇ hiӇn thӏ cùng mӝt trang m nguӗn không hoàn toàn giӕng nhau.
Nói so̩n th̫o siêu văn b̫n tͱc là t̩o ra trang mã ngu͛n HTML đúng quy
đ͓nh đ͋ đ͡ duy͏t hi͋u đưͫc và hi͋n th͓ đúng.
Sӱ dng HTrL đӇ soҥn thҧo các trang siêu văn bҧn, v͉ nguyên t̷c cũng
không khác m̭y so vͣi dùng các b͡ so̩n th̫o văn b̫n thông thưͥng. Chҷng hҥn,
trong soҥn thҧo văn bҧn thông thưӡng, đӇ làm nәi bұt các tiêu đӅ ta phҧi đánh dҩu
nó và chӑn cӥ to, căn chính giӳa... Chương trình soҥn thҧo văn bҧn sӁ chèn các dҩu
hiӋu thích hӧp (ta không nhìn thҩy đưӧc) vào đҫu và cuӕi đoҥn tiêu đӅ đưӧc chӑn
đӇ thӇ hiӋn nó theo yêu cҫu.
Vӟi HTrL cũng tương tӵ như vұy. ÒӇ làm nәi bұt các tiêu đӅ ta cҫn đánh
dҩu điӇm bҳt đҫu và điӇm kӃt thúc cӫa đoҥn tiêu đӅ bҵng c p thҿ Heading, ví d
< >... </ >. Bӝ duyӋt sӁ hiӇn thӏ đoҥn này vӟi cӥ chӳ to hơn và căn chính
giӳa.
Ví d, dòng sau đây trong tài liӋu HTrL
< >Tiêu đӃ mӫc </ >
sӁ đưӧc trình duyӋt hiӇn thӏ thành
Tiêu đӅ mӭc 1
15
HiӋn nay có nhiӅu công c soҥn thҧo siêu văn bҧn mҥnh như Microsoft
FrontPage, Dream Weaver.. vͣi giao di͏n tr͹c quan và t͹ đ͡ng sinh mã HTML,
cho phép so̩n th̫o siêu văn b̫n như so̩n th̫o thông thưͥng.
Tuy nhiên, vi͏c tìm hi͋u cú pháp cͯa HTML, n̷m vͷng ý nghĩa cͯa các th̓ khác
nhau v̳n r̭t c̯n thi͇t đ͋ có th͋ t̩o ra các trang Web đ͡ng, tương tác vͣi ngưͥi s͵
dͭng, tͱc là các ͱng dͭng Web sau này.
I.4.2. Các th͓ HTML
Các th̓ dùng đ͋ báo cho trình duy͏t cách thͱc trình bày văn b̫n trên màn
hình ho̿c dùng đ͋ chèn m͡t m͙i liên k͇t đ͇n các trang khác, m͡t đo̩n chương
trình khác...
M͟i th̓ g͛m m͡t tͳ khoá - KEYWORD - bao b͕c bͣi hai ḓu "bé hơn" (<) và
"lͣn hơn" (>).
H̯u h͇t các l͏nh th͋ hi͏n b̹ng m͡t c̿p hai th̓: th̓ mͧ (<KEYWORD>) và th̓
đóng (</KEYWORD>). Ḓu g̩ch chéo ("/") kí hi͏u th̓ đóng. L͏nh sͅ tác đ͡ng vào
đo̩n văn b̫n n̹m giͷa hai th̓.
<KEYWORD>pÒoңn văn bҥn chӍu tác đӛng cөa lӉnh</KEYWORD>

p
M͡t s͙ th̓ không có c̿p, chúng đưͫc g͕i là các th̓ r͟ng hay th̓ đơn. Ch͑
có th̓ mͧ <KEYWORD> mà thôi.
Nhi͉u th̓ có kèm các thu͡c tính (attribute), cung c̭p thêm các tham s͙ chi
ti͇t hơn cho vi͏c th͹c hi͏n l͏nh. Các thu͡c tính đưͫc chia làm hai lo̩i: thu͡c tính
b̷t bu͡c và thu͡c tính không b̷t bu͡c hay tuǤ ch͕n.
M͡t thu͡c tính là b̷t bu͡c n͇u như ph̫i có nó thì th̓ l͏nh mͣi th͹c hi͏n
đưͫc. Ví d, đӇ chèn mӝt hình ҧnh vào trang tài liӋu ta dùng thҿ <IMG> (Image).
Tuy nhiên, cҫn chӍ rõ cái ҧnh nào sӁ đưӧc dán vào đây. ÒiӅu này đưӧc thiӃt lұp
bҵng thuӝc tính SRC="đӍa chӋ cөa tӉp ҥnh". Thuӝc tính SRC là bҳt buӝc phҧi
có đӕi vӟi thҿ <IMG>.
16
I.4.3. Các quy t͇c chung
rӝt sӕ điӅu cҫn lưu ý khi soҥn thҧo siêu văn bҧn bҵng HTrL:
-p Nhi͉u ḓu cách li͉n nhau cũng ch͑ có tác dͭng như m͡t ḓu cách. B̩n
ph̫i s͵ dͭng th̓ đ͋ th͋ hi͏n nhi͉u ḓu giãn cách li͉n nhau.
-p Gõ Enter đ͋ xu͙ng dòng đưͫc xem như m͡t ḓu cách, đ͋ xu͙ng hàng thì
chúng ta ph̫i s͵ dͭng th̓ tương ͱng
-p Có th͋ vi͇t tên th̓ không phân bi͏t chͷ in thưͥng và in hoa.
-p Vì các kí t͹ ḓu lͣn hơn ">", ḓu nh͗ hơn "<" đã đưͫc dùng làm th̓ đánh
ḓu, do đó đ͋ hi͋n th͓ các kí t͹ này HTML quy đ͓nh cách vi͇t: > <
Nói chung, quy t̷c vi͇t các kí t͹ đ̿c bi͏t trong HTML là tên_quy_đ͓nh cͯa kí
t͹ n̹m giͷa ḓu ampersand - & và ḓu ch̭m pẖy ' ; '
Etên_quy_đӍnh;
5 ký tӵ đ c biӋt hay dùng
Ký tӵ Rách viӃt
< <
> >
³ "
Ký tӵ trҳng
& &
Có thӇ chèn các dòng bình luұn, chú thích... vào trang m nguӗn bҵng cách
đ t giӳa c p dҩu chú thích . Trình duyӋt sӁ bӓ qua không xét đӃn phҫn
m nҵm giӳa c p dҩu đó:

17
I.4.4. C̽u trúc cͿa mͱt tài li͟u HTML
M͕i tài li͏u HTML đ͉u có khung c̭u trúc như sau:
<TM>
<EAD><TITE></TITE></EAD>
<BODY>
</BODY>
</TM>
H y xem trình duyӋt hiӇn thӏ tài liӋu trên như thӃ nào. Dĩ nhiên là mӝt trang
trҳng chưa có nӝi dung gì cҧ !
Giͷa c̿p th̓ tiêu đ͉ <TITE>... </TITE> là dòng chͷ sͅ hi͏n lên trên
thanh tiêu đ͉ cͯa c͵a s͝ khi trình duy͏t đ͕c tài li͏u. N͇u b͗ tr͙ng thì trình duy͏t sͅ
cho hi͏n tên t͏p thay vào đó.
Toàn b͡ n͡i dung cͯa tài li͏u n̹m giͷa hai th̓ xác đ͓nh thân cͯa trang
<BODY>... </BODY>. Các dòng văn bҧn, hình ҧnh, âm thanh, video, các mӕi liên
kӃt... tҥo nên trang Web đӅu phҧi nҵm đây.
Ví d như tài liӋu HTrL đơn giҧn dưӟi đây:
<TM>
<EAD><TITE>Chә này là tiêu đӃ</TITE></EAD>
<BODY>
Toàn bӛ nӛi dung cөa tài liӉu nҳm ӡ đây: Các đoңn
văn bҥn xen lҭn hình ҥnh, âm thanh, video, các liên
kӁt đӁn vӍ trí khác, tài liӉu khác...
</BODY>
</TM>
H y xem trình duyӋt trình bày tài liӋu trên như thӃ nào.
Nhӟ lҥi rҵng nhiӅu dҩu cách chӍ đưӧc coi như mӝt, dҩu xuӕng dòng chӍ đưӧc
thӇ hiӋn như mӝt dҩu cách nên tài liӋu trên hoàn toàn tương đương vӟi tài liӋu sau đây:
<TM>
<EAD>
<TITE>Chә này là tiêu đӃ </TITE>
18
</EAD>
<BODY>
Toàn bӛ nӛi dung cөa tài liӉu nҳm ӡ đây: Các đoңn
văn bҥn xen lҭn hình ҥnh, âm thanh, video, các liên
kӁt đӁn vӍ trí khác, tài liӉu khác...
</BODY>
</TM>
Tuy nhiên, đӇ dӉ theo dõi và phát hiӋn lӛi, nên trình bày như trong văn bҧn
trưӟc: dóng thҷng cӝt tӯng c p thҿ, xuӕng dòng khi cҫn thiӃt, đ t các thҿ vào nơi
hӧp lý nhҩt.
I.4.5. Các ph̿n t΅ HTML (HTML element)
M͡t tài li͏u HTML t̩o nên tͳ nhi͉u thành ph̯n HTML. M͡t thành ph̯n
HTML đưͫc đánh ḓu b̹ng m͡t c̿p th̓ mͧ và th̓ đóng.
Các thành ph̯n HTML có th͋ c̭u trúc phân c̭p hình cây, thành ph̯n "ḿ"
chͱa nhi͉u thành ph̯n "con" khác l͛ng bên trong nó.
Có thành ph̯n r͟ng, ch͑ có th̓ mͧ.
Đ͋ so̩n th̫o tài li͏u HTML đúng cú pháp, c̯n n̷m vͷng c̭u trúc cͯa tͳng
thành ph̯n HTML.
Không gi͙ng như khi l̵p trình, n͇u b̩n m̷c l͟i cú pháp HTLM sͅ không có
m͡t thông báo l͟i nào báo cho bi͇t mà trình duy͏t sͅ hi͋u l̯m và trình bày trang
Web không như b̩n mu͙n mà thôi.
?ài tұp
1.p Nêu các đ c điӇm cӫa siêu văn bҧn (HTrL)
2.p ThӃ nào là trang Web?
19
CHƯƠNG II. TRÌNH ? TRANG
II.1. Tҥo tiêu đӅ

r đҫu các trang văn bҧn thưӡng là các tiêu đӅ cҫn làm nәi bұt tӯng phҫn
cӫa văn bҧn như Chương, rc,... cũng cҫn có đӅ mc rõ ràng khác vӟi phҫn thân
đӇ ngưӡi đӑc theo dõi cho thuұn tiӋn.
Có 6 mӭc tiêu đӅ trong HTrL. Cách thӇ hiӋn các tiêu đӅ ph thuӝc vào trình
duyӋt nhưng thông thưӡng thì:
Ëp Tiêu đӅ mӭc 1
Thҿ đӏnh nghĩa có dҥng: < >...</ >

Ví d:
< >Tiêu đӃ </ > cho ta tiêu đӃ tương ӫng Tiêu đӅ 1
Thҿ đӏnh nghĩa có dҥng: <2>...</2>

Ví d:
<2>Tiêu đӃ 2</2> cho ta tiêu đӃ tương ӫng Tiêu đӅ 2
Thҿ đӏnh nghĩa có dҥng: <3>...</3>

Ví d:
<3>Tiêu đӃ 3</3> cho ta tiêu đӃ tương ӫng Tiêu đӅ 3
Thҿ đӏnh nghĩa có dҥng: <>...</>
Ví d:
<>Tiêu đӃ </> cho ta tiêu đӃ tương ӫng Tiêu đӅ 4
20

Ví d:

Ví d:
II.2. Thҿ trình bày trang
II.2.1. Mͱt sͩ th͓ chính
Các thành phҫn trình bày trang đӇ đӏnh dҥng cҧ mӝt đoҥn văn bҧn và phҧi
nҵm trong phҫn thân cӫa tài liӋu. Có nhiӅu thҿ đưӧc sӱ dng nhưng trong tài liӋu
này chӍ trình bày mӝt sӕ thҿ trình bày chính: đӏnh dҥng phҫn đӏa chӍ (<ADDRESS>),
đoҥn văn bҧn (), xuӕng dòng ( ), căn chính giӳa (<CENTER>), đưӡng kҿ
ngang (<R>), đoҥn văn bҧn đ đӏnh dҥng sҹn (<PRE>), trích dүn nguӗn tài liӋu
(<BOCKUOTE>)
a. Đӏnh dҥng phҫn đӏa chӍ
Cho bi͇t thông tin như đ͓a ch͑, danh thi͇p và tác gi̫, thưͥng đ̿t ͧ đ̯u hay
cu͙i tài li͏u.
Thҿ đӏnh dҥng: <ADDRESS>«</ADDRESS>
Ví d:
<ADDRESS>
Newsletter editor 
J.R. Brown 
JimquickPost Neưs, Jumquick, CT 0 23 
Tel ( 23) 7890
</ADDRESS>
KӃt quҧ thu đưӧc:
21
b. Đoҥn văn bҧn
Thҿ này dùng đӇ xác đӏnh mӝt đoҥn văn bҧn. Thҿ (Paragraph) có thӇ
dùng kèm thuӝc tính đӇ ҩn đӏnh cách trình bày đoҥn văn bҧn.
ChӍ là giӟi hҥn mӝt đoҥn paragraph, cách bày trí do các thành phҫn khác tҥo
thành. Thưӡng chӍ có khoҧng trӕng khoҧng mӝt dòng hay nӱa dòng trưӟc
paragraph, trӯ khi nҵm trong phҫn đӏa chӍ <ADDRESS>«</ADDRESS>. rӝt sӕ trình
duyӋt thӇ hiӋn dòng đҫu cӫa paragraph tht vào.
Thҿ đӏnh nghĩa dҥng: ...
...
rӝt đoҥn văn bҧn rӛng là mӝt dòng trҳng.

Vì đҫu dòng CR (Carriage Return) không có hiӋu lӵc xuӕng dòng mӟi mà
chӍ có tác dng như mӝt dҩu cách, do đó có thӇ tҥo mӝt dòng d n cách (mӝt dòng
trҳng) giӳa các đoҥn văn bҧn cҫn phҧi sӱ dng thҿ . Trưӡng hӧp này chӍ cҫn
dùng thҿ đơn lҿ, không cҫn thҿ đóng.
Chú ý: mӝt sӕ thҿ khác như các thҿ tiêu đӅ < >,...,<>, dòng kҿ ngang
<R>, danh sách, bҧng biӇu,... đ kèm luôn viӋc xuӕng dòng thành mӝt đoҥn văn
bҧn mӟi. Không cҫn dùng thêm thҿ trưӟc và sau các thҿ này.
c. Xuӕng dòng
Th̓ này dùng đ͋ xu͙ng dòng mͣi. B̷t bu͡c xu͙ng dòng t̩i v͓ trí g̿p tͳ khóa
này. Dòng mͣi đưͫc căn l͉ như dòng đưͫc b̓ t͹ đ͡ng khi dòng đó quá dài
Thҿ đӏnh nghĩa dҥng: 
NӃu không muӕn chèn mӝt dòng trҳng mà chӍ đơn thuҫn muӕn xuӕng dòng
mӟi thì cҫn sӱ dng thҿ (Break). Thҿ Break không cҫn có thҿ đóng kèm theo.
22
d. Đưӡng kҿ ngang
Thҿ này tҥo ra đưӡng kҿ ngang (Horizontal Rule) ngăn cách giӳa các phҫn
trong tài liӋu.
Thҿ đӏnh nghĩa dҥng: <R>
<R width=n%|n(pixel) size=n align=left|center|righ noshade>
Ví d:
<R>
<ADDRESS>¼ebruary 8, 99, CERN</ADDRESS>
e. Căn chính giӳa

Th̓ này dùng đ͋ căn ch͑nh đo̩n văn b̫n ͧ giͷa chi͉u r͡ng trang văn b̫n.
Thҿ đӏnh nghĩa dҥng: <CENTER>...</CENTER>
Thҿ này cũng có tác dng xuӕng dòng khi kӃt thúc đoҥn văn bҧn.
/. Đoҥn văn bҧn đã đӏnh dҥng sҹn
Giӟi hҥn đoҥn văn bҧn đ đưӧc đӏnh dҥng sҹn (pre-formatted) cҫn đưӧc thӇ
hiӋn bҵng phông chӳ có đӝ rӝng ký tӵ không đәi (do phҧi thҷng cӝt). NӃu không có
thuӝc tính WIDT đi cùng thì bӅ rӝng m c đӏnh là 80 ký tӵ/dòng. BӅ rӝng 40,80 và
132 đưӧc thӇ hiӋn tӕi ưu, còn các bӅ rӝng khác có thӇ đưӧc làm tròn.
Thҿ đӏnh nghĩa dҥng: <PRE>...</PRE>
Trong các thành phҫn trưӟc:
Dҩu xuӕng dòng sӁ có ý nghĩa chuyӇn sang dòng mӟi (chӭ không còn là dҩu
cách)
 không dùng. NӃu nó sӁ đưӧc coi như xuӕng dòng
Òưӧc phép dùng các thành phҫn liên kӃt nhҩn mҥnh
Không đưӧc chӭa các thành phҫn đӏnh dҥng paragraph (tiêu đӅ, đӏa chӍ,«)
23
Ký tӵ TAB (có m US-ASCII và ISO-8859-1 là 9) phҧi hiӇu là sӕ dҩu cách
nhӓ nhҩt sao cho đӃn ký tӵ tiӃp theo vӏ trí là bӝi cӫa 8. Tuy nhiên không nên dùng.
Ví d:
<PRE WIDT=´80´>
NguyӇn Văn A Thӥ rèn
Trҩn ThӍ B Thӥ Sơn
</PRE>
NguyӇn Văn A Thӥ rèn

Trҩn ThӍ B Thӥ Sơn
g. Trích dүn nguӗn tài liӋu khác

Dùng đ͋ trích d̳n m͡t đo̩n văn b̫n, thưͥng đưͫc th͋ hi͏n b̹ng chͷ
nghiêng có căn l͉ thͭt vào trong (như m͡t paragraph) và thưͥng có m͡t dòng
tr͙ng trên và dưͣi.
Thҿ đӏnh nghĩa dҥng:
<BOCKUOTE>...</BOCKUOTE>
Ví d:
I think the poem ends
<BOCKUOTE>
Soft you now, the fair Ophelia. Nymph, in thy orisons, be
all my sins remembed. </BOCKUOTE> but I am not sure.

I think the poem ends
Soft you now, the fair Ophelia. Nymph,

in thy orisons, be all my sins
remembed.
but I am not sure.
24
II.2.2. Các thuͱc tính cͿa th͓ trình bày trang
a. Thuӝc tính ALIGN cӫa thҿ Paragraph
Thҿ dùng đӇ xác đӏnh mӝt đoҥn văn bҧn (như trình bày phҫn trưӟc).
Dưӟi đây ta tìm hiӇu kӻ thêm mӝt sӕ các thuӝc tính kèm theo (AIGN) cӫa nó. Có
thӇ căn lӅ trái (left - m c đӏnh), căn giӳa (center) ho c căn lӅ phҧi (right).
Ëp Căn lӅ trái: «

Cҧ đoҥn văn bҧn đưӧc căn lӅ trái cӫa trang.
Ví d:

Có lҩn tôi thҧy mӛt ngưӟi đi
Chҵng biӁt vӃ đâu nghĩ ngӥi gì
Chân bưӝc hӱng hӟ theo bóng lҽ
Mӛt mình làm cҥ cuӛc phân ly

KӃt quҧ trҧ vӅ mӝt đoҥn văn bҧn đưӧc căn lӅ bên trái như sau:
R ppp p
p pp
Rppppppp
Rp pppp pp
p
p!
p"pp#p p
Ëp Căn giӳa: «

Cҧ đoҥn văn bҧn đưӧc căn chính giӳa trang.
Ví d:


KӃt quҧ trҧ vӅ mӝt đoҥn văn bҧn đưӧc căn giӳa như sau:
R ppp p
p pp
Rppppppp
Rp pppp pp
25
p
p!
p"pp#p p
Ëp Căn lӅ phҧi: «
Cҧ đoҥn văn bҧn đưӧc căn lӅ bên phҧi cӫa trang.
Ví d:


KӃt quҧ trҧ vӅ mӝt đoҥn văn bҧn đưӧc căn lӅ bên phҧi như sau:
R ppp p
p pp
Rppppppp
Rp pppp pp
p
p!
p"pp#p p
b. Thuӝc tính Clear cӫa thҿ xuӕng dòng

Thҿ xuӕng dòng cũng có 3 thuӝc tính kèm theo như sau:
 
 
 
Các thҿ đưӧc sӱ dng khi chèn hình ҧnh, đӇ các dòng chӳ xuҩt hiӋn bên dưӟi,
bên trái hay bên phҧi cӫa hình.
c. Các kiӇu đưӡng kҿ ngang khác nhau
Như phҫn trên đ giӟi thiӋu, thҿ <R> tҥo mӝt đưӡng kҿ ngang chҥy suӕt
chiӅu rӝng cӱa sә màn hình. Các đưӡng kҿ này có thӇ đưӧc thay đәi đӝ đұm
(mҧnh), ngҳn, dài, căn lӅ trái, căn lӅ phҧi,« bҵng cách sӱ dng các thuӝc tính cӫa
chúng.
<R WIDT=n% SIZE=n AIGN=E¼T|RIGT NOSADE>
Trong đó:
26
Thҿ, thuӝc tính Miêu tҧ
<R> Chèn dòng kҿ ngang suӕt chiӅu rӝng cӱa sә màn hình
Thay đәi đӝ dài cӫa đưӡng kҿ, chiӃm n% đӝ rӝng cӱa
WIDT = n% sә màn hình. NӃu không có % đҵng sau thì đӝ dài
tính theo đơn vӏ pixcel
Thay đәi đӝ đұm hay mҧnh cӫa đưӡng kҿ. n là sӕ
SIZE = n
pixcel
Căn lӅ trái|phҧi. Òưӡng kҿ ngang m c đӏnh đưӧc căn
AIGN=E¼T|RIGT
chính giӳa
NOSADE Không có bóng mӡ, đưӡng kҿ thành màu đen
?ài tұp
1.p Tiêu đӅ trong trang Web có mҩy mӭc chính?
2.p Nêu các thuӝc tính cӫa thҿ Paragraph (). H y tҥo mӝt trang web đơn giҧn
trong đó có sӱ dng tiêu đӅ mӭc 2 và thҿ Paragraph ().
3.p Tҥo mӝt trang web đơn giҧn tӵ giӟi thiӋu vӅ mình, bҥn bao nhiêu tuәi, bҥn
làm gì, s thích cӫa bҥn.
27
CHƯƠNG III. DANH SÁCH V ?NG TRONG HTML
III.1. Các kiӇu danh sách

ViӋc liӋt kê danh sách sӁ làm cho văn bҧn tr nên sáng sӫa và dӉ theo dõi.
Trong HTrL có mӝt sӕ kiӇu danh sách như danh sách đánh sӕ thӭ tӵ, danh sách
không đánh sӕ thӭ tӵ, danh sách đӏnh nghĩa, danh sách kiӇu bҧng chӑn và danh
sách kiӇu thư mc.
rӝt sӕ trình duyӋt không hӛ trӧ danh sách kiӇu bҧng chӑn và danh sách kiӇu
thư mc.
III.1.1. Danh sách không đánh sͩ th΁ tΉ
Danh sách không đánh sӕ thӭ tӵ liӋt kê các mc bҵng mӝt chҩm tròn đҫu
mӛi mc.
Cú pháp:

 Mӧc thӫ
 Mӧc thӫ 2
««

C p thҿ « đánh dҩu bҳt đҫu và kӃt thúc danh sách. Nó có tác
dng lùi lӅ trái danh sách vào sâu hơn.
Các thҿ có tác dng thӇ hiӋn bҳt đҫu mӝt dòng mӟi vӟi mӝt chҩm tròn.
Ví d:

 Mӧc thӫ
 Mӧc thӫ 2
 Mӧc thӫ 3

KӃt quҧ trҧ vӅ mӝt danh sách sau:
Ëp $p%p&p
Ëp $p%p'p
Ëp $p%p(p
28
Theo m c đӏnh, mӛi mc thuӝc mӭc thӭ nhҩt cӫa danh sách không đánh sӕ
thӭ tӵ bҳt đҫu bҵng mӝt chҩm tròn, còn mӛi mc thuӝc mӭc thӭ hai sӁ bҳt đҫu bҵng
mӝt vòng tròng.
Ta vүn có thӇ thay đәi bҵng cách sӱ dng thuӝc tính TYPE
Cú pháp:

ho c
<UI TYPE=DISC|CIRCE|SUARE>
Ví d:

 Mӧc thӫ
 Mӧc thӫ 2
 Mӧc thӫ 3

op $p%p&p
op $p%p'
op $p%p(p
III.1.2. Danh sách đánh sͩ th΁ tΉ

Danh sách đánh sӕ thӭ tӵ giӕng như danh sách không đánh sӕ thӭ tӵ nhưng
các chҩm tròn đҫu mӛi mc sӁ đưӧc thay bi viӋc đánh sӕ thӭ tӵ các mc đó.
Cú pháp:
<O>
 Mӧc thӫ
 Mӧc thӫ 2
««
</O>
C p thҿ <O>«</O> đánh dҩu bҳt đҫu và kӃt thúc danh sách. Nó có tác
dng lùi lӅ trái danh sách vào sâu hơn.
29
Các thҿ có tác dng thӇ hiӋn bҳt đҫu mӝt dòng mӟi vӟi mӝt sӕ thӭ tӵ
tương ӭng.
Ví d:
<O>
 Mӧc thӫ
 Mӧc thӫ 2
 Mӧc thӫ 3
</O>
1. $p%p&p
2. $p%p'p
3. $p%p(p
Có thӇ dùng thuӝc tính TYPE đӇ lӵa chӑn các cách đánh thӭ tӵ khác nhau
khi bҳt đҫu mӛi mc trong mӝt danh sách có đánh sӕ thӭ tӵ:
Chӳ in hoa A,B,C,« (TYPE=A)
Chӳ in thưӡng a,b,c,« (TYPE=a)
Chӳ sӕ La m lӟn I,II,III,« (TYPE=I)
Chӳ sӕ La m nhӓ i, ii, iii,« (TYPE=i)
Sӕ thӭ tӵ 1,2,3,4,« (TYPE= ), đây là lӵa chӑn m c đӏnh

Cú Pháp:
<O TYPE=A|a|I|i| >
Ho c

Ví d:

 Mӧc thӫ
 Mӧc thӫ 2
 Mӧc thӫ 3

30
up $p%p&p
II.p $p%p'
uuu p $p%p(p
III.1.3. Danh sách các đͣnh nghĩa

Danh sách các đӏnh nghĩa trông giӕng như mӝt bҧng tӯ vӵng hay bҧng giҧi
thích các thuұt ngӳ lùi vào trong.
Cú pháp:
<O TYPE=A|a|I|i| >
hoҹc

Ví d:
<D>
<DT> Mӧc thӫ
<DD> Nӛi dung mӧc thӫ
<DT> Mӧc thӫ 2
<DD> Nӛi dung mӧc thӫ 2
<DT> Mӧc thӫ 3
<DD> Nӛi dung mӧc thӫ 3
</D>
$p%p&p
p )p*p
$p%p&p
$p%p'p
p )p*p
$p%p'p
$p%p(p
p )p*p
$p%p(p
III.1.4. Danh sách phͩi hͻp, lͫng nhau

Các kiӇu danh sách nêu trên đӅu có thӇ lӗng nhau và lӗng nhau nhiӅu mӭc.
Ví d:
31

Mӫc

Mӫc .
Mӫc .2

Mӫc 2

Mӫc 2.
Mӫc 2.2


KӃt quҧ trҧ vӅ:
Ëp %p&p
Ëp %p& &p
Ëp %p& 'p
Ëp %p'p
Ëp %p' &p
Ëp %p' 'p
III.2. ?ҧng biӇu

III.2.1. Khung c̽u trúc
Giӟi hҥn bҧng: <TABE>«</TABE>
Òӏnh nghĩa mӝt hàng: <TR>«</TR>
Òӏnh nghĩa mӝt ô: <TD>«</TD>
Ô chӭa tiêu đӅ: <T>«</T>. (=eader)
Òҫu đӅ cӫa bҧng: <CAPTION>«</CAPTION>

Cú pháp tҥo khung cҩu trúc cӫa mӝt bҧng:
<TABE>
<TR> <T> Tên cӛt </T>
<T> Tên cӛt 2 </T>
...
</TR>
<TR>
<TD> Ô dòng </TD>
32
<TD> Ô 2 dòng </TD>
....
</TR>
........
</TABE>
Ví d:
<TABE>
<TR>
<T> ӏ và tên </T>
<T> ӝp </T>
<T> uê quán </T>
</TR>
<TR>
<TD> Bùi Thanh Trúc </TD>
<TD> K0CA </TD>
<TD> à Nӛi </TD>
</TR>
<TR>
<TD> NguyӇn Mai ương </TD>
<TD> K0CB </TD>
<TD> Thanh óa </TD>
</TR>
</TABE>
KӃt quҧ thu đưӧc bҧng như sau:
Hӑ và tên Lӟp Quê quán

Bùi Thanh Trúc K50CA Hà Nӝi
NguyӉn rai Hương K50CB Thanh Hóa
III.2.2. Mͱt sͩ lưu ý v͙ b̻ng

Ô rӛng thì không có đưӡng bao. ruӕn ô rӛng có đưӡng bao phҧi dùng dҩu
cách không bҿ dòng:
<TD>Enbsp;</TD> hoҹc <TD> </TD>
Có thӇ lӧi dng ROWSPAN và COSPAN đӇ tҥo bҧng có ô chӗng chéo lên
nhau nhưng không nên lҥm dng.
33
Òôi lúc hình ҧnh nҵm ngoài ô ta muӕn đưa hình ҧnh đó vào. Nguyên nhân là
do HTrL đưӧc viӃt như sau:
<TD>
<IMG SRC=úrl´>
</TD>
Dҩu xuӕng dòng đây coi như dҩu cách do đó có sӵ chӗng chéo hình ҧnh
vӟi ký tӵ trҳng đó. Cách khҳc phc như sau:
<TD><IMG SRC=úrl´></TD>
LTABLE>«</TABLE>
r c đӏnh bҧng không có đưӡng bao nӃu không đi vӟi thuӝc tính BORDER.
Bҧng có các thuӝc tính sau:
BORDER
ÒӇ đӏnh nghĩa mӝt bҧng có đưӡng bao. Tuy nhiên không làm ҧnh hưng tӟi
đӝ rӝng cӫa bҧng.
? =<giá trӍ>
Cho phép khai báo đӝ dày cӫa đưӡng bao cho phép chӍnh đưӡng bao ngoài
đұm hơn đưӡng bao trong đӇ dӉ nhìn hơn, m t khác nӃu giá trӏ bҵng không lҥi cho
phép dành chӛ cho sӕ liӋu bên trong, nhҩt là đӕi vӟi nhӳng bҧng compact.
CESPACING=<giá trӍ>
Khoҧng cách giӳa các ô.
CEPADDING=<giá trӍ>
Khoҧng cách giӳa nӝi dung cӫa ô và đưӡng bao.
<TABE BORDER=0 CESPACING=0 CEPADDING=0>
Cho ta bҧng compact nhҩt có thӇ có (dành tҩt cҧ cho nӝi dung).
ï =<giá trӍ hay phҩn trăm>
NӃu đi cùng vӟi <TABE> thuӝc tính này có ý nghĩa mô tҧ chiӅu rӝng mong
muӕn cӫa bҧng (tính tuyӋt đӕi bҵng pixels hay theo phҫn trăm so vӟi bӅ rӝng cӫa
tài liӋu). Thưӡng thì trình duyӋt tӵ tính toán sao cho bҧng đưӧc bӕ trí hӧp lý. Dùng
34
thuӝc tính này bҳt buӝc trình duyӋt cӕ gҳng làm sao xӃp đưӧc các ô vào bҧng có bӅ
rӝng mong muӕn đó.
NӃu đi cùng vӟi <T> hay <TD> lҥi có ý nghĩa tương tӵ đӕi vӟi mӝt ô.
ROWSPAN
Cho biӃt ô hiӋn thӡi chiӃm mҩy hàng cӫa bҧng, m c đӏnh là 1.
ALIGN
NӃu nҵm trong <CAPTION> nó có ý nghĩa đӕi vӟi đҫu đӅ cӫa hàng nҵm trên
hay nҵm dưӟi, có giá trӏ ho c TOP ho c BOTTOM (m c đӏnh là TOP).
NӃu nҵm trong <TR>, <T> hay <TD> có giá trӏ E¼T, CENTER hay RIGT
và điӅu khiӇn viӋc đ t nӝi dung cӫa ô căn bên trái, vào giӳa ô hay căn bên phҧi.
VALIGN
NӃu nҵm trong <TR>, <T> hay <TD> có thӇ có các giá trӏ TOP, MIDDE,
BOTTOM hay BASEINE đӇ điӅu khiӇn viӋc đ t nӝi dung cӫa ô lên trên, vào giӳa
(theo chiӅu dӑc) hay xuӕng dưӟi và cũng có thӇ là tҩt cҧ cùng các ô trong hàng
cùng căn theo mӝt đưӡng nҵm ngang.
<TD «>«</TD>
Có nghĩa là dӳ liӋu bҧng (Table Data), chӍ đưӧc xuҩt hiӋn trong mӝt hàng
cӫa bҧng. rӛi hàng không nhҩt thiӃt phҧi có cùng sӕ ô vì dòng ngҳn hơn sӁ đưӧc
chҳp thêm ô rӛng vào bên phҧi. rӛi ô chӍ đưӧc chӭa các thành phҫn bình thưӡng
khác nҵm trong phҫn thân cӫa tài liӋu. Các thuӝc tính m c đӏnh là: AIGN=left và
VAIGN=middle. Các m c đӏnh này có thӇ thay đәi bi các thuӝc tính trong <TR>
và lҥi thay đәi tiӃp bi thuӝc tính AIGN ho c VAIGN khai báo riêng cho tӯng ô.
Bình thưӡng m c đӏnh thì nӝi dung sӁ đưӧc bҿ dòng cho vӯa vào khә rӝng cӫa tӯng
ô. Dùng thuӝc tính NOWRAP trong <TD> đӇ cҩm viӋc đó.
<TD«>«</TD> cũng có thӇ chӭa các thuӝc tính NOWRAP, COSPAN và

ROWSPAN.
NOWRAP
Như nói trên, cҫn thұn trӑng khi dùng thuӝc tính này đӇ phòng có ô quá rӝng.
35
ROLSPAN
Có thӇ xuҩt hiӋn trong bҩt kǤ ô nào (<T> hay <TD>) và chӍ rҵng ô đó bành
trưӟng ra mҩy cӝt cӫa bҧng, m c đӏnh là 1.
<TH «> « </TH>
Có nghĩa là tiêu đӅ cӫa bҧng (Table Header), các ô này tương tӵ như ô bình
thưӡng khác đưӧc đӏnh nghĩa bҵng <TD>, có điӅu font chӳ đұm và có thuӝc tính
m c đӏnh là AIGN=Center. <T «>«</T> cũng có thӇ chӭa thuӝc tính
VAIGN, NOWRAP, COSPAN và ROWSPAN.
<RAPTION «> « </RAPTION>
Ò t đҫu đӅ cho mӝt bҧng nên phҧi nҵm trong mӝt c p <TABE> song không
đưӧc nҵm trong hàng hay cӝt. Thuӝc tính m c đӏnh là AIGN=Top (đҫu đӅ đ t
đҫu bҧng), song có thӇ đ t là AIGN=Bottom (cuӕi bҧng). Òҫu đӅ có thӇ chӭa bҩt
kǤ thành phҫn nào mӝt ô có thӇ chӭa và luôn đưӧc căn lӅ vào giӳa bҧng (theo chiӅu
ngang) và có thӇ cũng có bҿ dòng cho phù hӧp.
Dưӟi đây là bҧng tóm tҳt liӋt kê các thuӝc tính cӫa thҿ xây dӵng bҧng:
Thҿ/Thuӝc tính Ý nghĩa
TABE - Bҳt đҫu bҧng
BORDER - Ò t khung nәi 3D xung quanh bҧng. Ò t
<TABE BORDER=n
BORDER=0 sӁ làm mҩt biên bao quanh.
CESPACING=n
CEPADDING=n CESPACING - Ò t đӝ dҫy cӫa dòng kҿ ngang trong
BGCOOR="rrggbb"> bҧng.
CEPADDING - Ò t kích thưӟc cӫa mӝt ô.
BGCOOR - Ò t màu nӅn cӫa bҧng.
<TR> B3/t Òҫu mӝt dòng cӫa bҧng ± Table row.
B3/t Òҫu mӝt ô cӫa bҧng (bҳt đҫu cӝt trong mӝt
<TD>
bҧng).
Thҿ <T> giӕng như <TD> nhưng cho chӳ đұm và
<T>
căn chính giӳa - (heading).
<CAPTION> Ò t tiêu đӅ (đҫu đӅ) cho mӝt bҧng
Thuӝc tính dùng kèm bên trong các thҿ <TR>, <T>
AIGN=MIDDE|RIGT hay <TD> đӇ căn lӅ chӳ trong mӝt ô cӫa bҧng theo
chiӅu ngang
VAIGN=TOP|BOTTOM Thuӝc tính dùng kèm các thҿ <TR>, <T> hay <TD>
36
đӇ gi n mӝt ô theo chiӅu ngang chiӃm nhiӅu cӝt hơn
các ô trên dòng khác.
Thuӝc tính dùng kèm các thҿ <T> hayp<TD>pđӇ đ t
WIDT=n%
đӝ rӝng cӫa ô.
Thuӝc tính dùng kèm các thҿ <T> hay <TD> đӇ gi n
COSPAN=n mӝt ô theo chiӅu ngang chiӃm nhiӅu cӝt hơn các ô
trên dòng khác.
Thuӝc tính dùng kèm các thҿ <T> hay <TD> đӇ gi n
ROWSPAN=n mӝt ô theo chiӅu đӭng chiӃm nhiӅu dòng hơn các ô
cӝt khác
</TABE> KӃt thúc bҧng
III.2.3. Các ví dͽ
Ví d mӝt bҧng cơ bҧn gӗm 2 dòng và 3 cӝt:
<TABE BORDER>
<TR>
<TD>A</TD><TD>B</TD><TD>C</TD>
</TR>
<TR>
<TD>D</TD><TD>E</TD><TD>¼</TD>
</TR>
</TABE>
KӃt quҧ trҧ vӅ:
Ví d mӝt bҧng có Item 2 (tiêu thӭc 2) chiӃm 2 hàng (dòng):

<TABE BORDER>
<TR>
<TD>Item </TD>
<TD ROWSPAN=2>Item 2</TD>
<TD>Item 3</TD>
</TR>
<TR>
<TD>Item </TD> <TD>Item </TD>
</TR>
37
</TABE>
KӃt quҧ trҧ vӅ:
Ví d mӝt bҧng có Item 1 (tiêu thӭc 2) chiӃm 2 hàng (dòng):

<TABE BORDER>
<TR>
<TD ROWSPAN=2>Item </TD>
<TD>Item 2</TD> <TD>Item 3</TD> <TD>Item </TD>
</TR>
<TR>
<TD>Item </TD> <TD>Item </TD> <TD>Item 7</TD>
</TR>
</TABE>
KӃt quҧ trҧ vӅ:
Ví d bҧng có Item 2 (tiêu thӭc 2) chiӃm 2 cӝt:

<TABE BORDER>
<TR>
<TD>Item </TD>
<TD COSPAN=2>Item 2</TD>
</TR>
<TR>
<TD>Item 3</TD> <TD>Item </TD> <TD>Item </TD>
</TR>
</TABE>
KӃt quҧ trҧ vӅ:
38
Ví d mӝt bҧng có tiêu đӅ:
<TABE BORDER>
<TR>
<T>ead </T> <T>ead 2</T> <T>ead 3</T>
</TR>
<TR>
<TD>D</TD> <TD>E</TD> <TD>¼</TD>
</TR>
</TABE>
KӃt quҧ trҧ vӅ:
Ví d mӝt bҧng có tiêu đӅ chiӃm 2 cӝt:

<TABE BORDER>
<TR>
<T COSPAN=2>ead </T>
<T COSPAN=2>ead 2</T>
</TR>
<TR>
<TD>A</TD> <TD>B</TD> <TD>C</TD> <TD>D</TD>
</TR>
<TR>
<TD>E</TD> <TD>¼</TD> <TD>G</TD> <TD></TD>
</TR>
</TABE>
KӃt quҧ trҧ vӅ:
39
?ài tұp
1.p Sӱa phҫn giӟi thiӋu cӫa bҥn (bài tұp 3, chương 2) sao cho các mc đó đưa vӅ
dҥng danh sách và liӋt kê 5 thӭ bҥn thích nhҩt dưӟi dҥng sӕ.
2.p Áp dng nhӳng gì đ hӑc trên, h y tҥo mӝt danh sách như sau:
Ë Top level 1
Ë Top level 2
1.p Second Level

op Fact 1
op Fact 2
Ë Top level 3
3.p Áp dng nhӳng gì đ hӑc trên, h y tҥo bҧng giӕng như sau:
Tәng kӃt năm hӑc 2003 - 2004

Thӕng kê HS giӓi HS khá HS trung bình
Lӟp 1A 35 4 0
Lӟp 1B 20 10 12
Lӟp 1C 5 25 20
40
CHƯƠNG IV. ĐƯA HÌNH NH V O T I LIӊU HTML
IV.1. Hình ҧnh tĩnh

IV.1.1. T͟p ̻nh
rӛi ҧnh đưӧc lưu giӳ trong máy tính thành mӝt tӋp riêng biӋt. TӋp ҧnh có
nhiӅu đӏnh dҥng khác nhau, thӇ hiӋn qua phҫn m rӝng (đuôi) cӫa tên tӋp: *.bmp,
*.gif, *.jpeg, *.jpg,«
Tuy nhiên các trình duyӋt chӍ có thӇ ³hiӇu´ đưӧc các tӋp ҧnh dưӟi dҥng GIF
hay JPEG. Hình ҧnh dҥng GIF đưӧc sӱ dng rӝng r i nhҩt trên Internet, sau đó là
đӃn các ҧnh dҥng JPEG.
IV.1.2. Th͓ <IMG«>
Cú pháp chèn ҧnh vào trang Web:
<IMG SRC=ÚR´>
IMG (Image), thuӝc tính SRC (Source) là đưӡng dүn đӃn nơi lҩy tӋp ҧnh. Giá
trӏ cӫa thuӝc tính SRC đưӧc gán bҵng URL là mӝt đӏa chӍ trên máy tính đӏa phương
hay trên Internet. Nó chӍ ra nơi lưu trӳ tӋp ҧnh cҫn chèn vào.
Òӏa chӍ URL báo cho trình duyӋt biӃt cҫn lҩy tӋp ҧnh đâu.
NӃu tӋp ҧnh nҵm ngay trên máy tính đӏa phương thì cҫn ghi rõ đưӡng dүn
NӃu tӋp ҧnh lҩy tӯ mӝt nơi khác trên Internet thì phҧi ghi đҫy đӫ đӏa chӍ URL
Ví d:
<IMG SRC=´logo.gif´>
IV.2. Các thuӝc tính cӫa thҿ chèn hình ҧnh
Trong thҿ IrG còn có mӝt sӕ thuӝc tính khác như: ALT, WIDTH,
HEIGHT, ALIGN, VSPACE, HSPACE, BORDER
IV.2.1. Thuͱc tính ALT
Thuӝc tính AT ± ALTernative cho phép ta chèn mӝt đoҥn chӳ thay thӃ vào
chӛ có hình và hiӋn lên xâu chú thích khi đưa trӓ chuӝt vào ҧnh. Thuӝc tính này
dùng trong trưӡng hӧp trình duyӋt không hiӇn thӏ đưӧc hình ҧnh thì sӁ hiӋn dòng
văn bҧn thay thӃ. Làm như vұy đӇ nhӳng ngưӡi sӱ dng trình duyӋt không có khҧ
41
năng đӑc ҧnh hay đ tҳt chӭc năng đӑc ҧnh đӇ tăng tӕc đӝ có thӇ biӃt đưӧc đó là
hình ҧnh gì và hӑ có thӇ chӑn xem sau nӃu có thӡi gian.
Nên luôn sӱ dng thuӝc tính này khi đưa hình ҧnh vào trang Web vì nhiӅu
ngưӡi muӕn có tӕc đӝ cao, lưӟt nhanh qua các thông tin là chính đ tҳt chӭc năng
đӑc ҧnh cӫa trình duyӋt vүn có thӇ biӃt đưӧc ҧnh đó mang nӝi dung gì.
Ví d:
<IMG SRC=´face.gif´ AT=Ńhay mat´>
HiӋn ҧnh Ҧnh (không hiӋn lên) khi có và không sӱ dng thuӝc tính ALT
NӃu không sӱ dng thuӝc tính AT thì tҥi chӛ có hình sӁ hiӋn tӯ IMAGE ho c
biӇu tưӧng ҧnh bӏ khuyӃt.
IV.2.2. Thuͱc tính WIDTH và HEIGHT
Thuӝc tính WIDT và EIGT dùng đӇ xác đӏnh chiӅu rӝng và chiӅu cao cӫa
ҧnh. Giá trӏ này có thӇ tính theo phҫn trăm (%) ho c pixel.
Chú ý:
NӃu đ t chiӅu rӝng và chiӅu cao không chuҭn sӁ làm hình trong ҧnh bӏ co
gi n méo đi. ÒӇ khҳc phc nhưӧc điӇm này, ta nên xӱ lý ҧnh đӇ kích thưӟc phù
hӧp vӟi yêu cҫu.
Ví d:
<IMB SRC=´face.gif´ WIDT= 00 EIGT= 00>
<IMB SRC=´face.gif´ WIDT=0 EIGT=0>

42
IV.2.3. Thuͱc tính ALIGN
Thuӝc tính AIGN cho phép chӍnh lҥi vӏ trí cӫa ҧnh theo cҧ hai chiӅu ngang
và chiӅu dӑc.
Theo chiӅu dӑc: AIGN=MIDDE, AIGN=TOP, AIGN=BOTTOM
AIGN=TOP AIGN=MIDDE AIGN=BOTTOM
Theo chiӅu ngang: AIGN=E¼T, AIGN=RIGT
AIGN=E¼T AIGN=RIGT
NӃu như không có thuӝc tính này thì m c đӏnh ҧnh đưӧc đ t tҥi đúng nơi đ t
thҿ IrG dóng trên cùng dòng chӳ, theo cҥnh dưӟi cӫa khung nhìn.
IV.2.4. Thuͱc tính VSPACE và HSPACE
Khi sӱ dng thuӝc tính ALIGN, ҧnh đưӧc chèn vào dòng văn bҧn vӟi các
chӳ dính sát liӅn. Thuӝc tính VSPACE và HSPACE dùng đӇ tҥo khoҧng trӕng nhӓ
viӅn xung quanh ҧnh (tính theo đơn vӏ pixel).
VSPACE=n Thêm khoҧng trӕng theo chiӅu dӑc
SPACE=n Thêm khoҧng trӕng theo chiӅu ngang
Ví d:
<IMG SEC=´face.gif´ VSPACE=20 SPACE=20>
43
?ài tұp
1.p H y cho biӃt tҥi sao các ҧnh dưӟi đây có thӇ đưӧc nhúng vào trong mӝt tài liӋu
HTrL? ViӃt đoҥn code đưӧc dùng đӇ nhúng các ҧnh đó.
2.p Tҥo mӝt trang web và chèn các ҧnh sao cho ҧnh nҵm phía bên trái, và các
đoҥn văn bҧn nҵm bên phҧi.
3.p Tҥo mӝt trang web và chèn các ҧnh sao cho ҧnhh đưӧc căn giӳa và các đoҥn
văn bҧn nҵm trên ho c bên dưӟi.
44
CHƯƠNG V. CÁC MӔI LIÊN KӂT SIÊU VĂN ?N
V.1. Thҿ neo và mӕi liên kӃt

Các liên kӃt siêu văn bҧn trong mӝt tài liӋu HTrL là đӇ tham chiӃu đӃn mӝt
tài liӋu khác hay mӝt phҫn tài liӋu khác nҵm trong tài liӋu đó.
Liên kӃt siêu văn bҧn gӗm có ba phҫn: giao thӭc, cái neo và đӏa chӍ hay URL
ÒӇ tҥo mӝt mӕi liên kӃt thì viӋc đҫu tiên cҫn làm là thiӃt lұp cái neo. C p thҿ
tҥo neo là <A>«</A> (Anchor). Thҿ này có nhiӅu thuӝc tính bҳt buӝc phҧi xác đӏnh
rõ, ta sӁ tìm hiӇu kӻ hơn phҫn sau.
V.1.1. Thuͱc tính HREF
RE¼ (Hypertext REFerence ± tham chiӃu siêu văn bҧn) đưӧc dùng đӇ liên
kӃt đӃn:
rӝt tài liӋu khác (external link) hay
rӝt phҫn khác nҵm trong chính tài liӋu đang đӑc (internal link)
Giao thӭc đӇ tham chiӃu RE¼ là HTTP. NӃu là liên kӃt nӝi tҥi ± internal link
thì không cҫn phҧi có phҫn giao thӭc.
V.1.2. Liên k͗t ra ngoài ± External Links
ÒӇ liên kӃt đӃn mӝt tài liӋu khác, ta cҫn phҧi biӃt đӏa chӍ URL cӫa tài liӋu
đích. Cũng cҫn phҧi chӍ chӛ, thưӡng là mӝt nhóm vài tӯ đӇ làm đҫu mӕi liên kӃt.
Nhóm tӯ này sӁ đәi màu đӇ phân biӋt, con chuӝt trӓ vào sӁ có hình bàn tay và khi
nhҩn chuӝt thì trang siêu văn bҧn đích sӁ đưӧc hiӇn thӏ.
Nên chӑn các tӯ làm đҫu mӕi sao cho gӧi tҧ và sao cho tӵ nhiên, không ҧnh
hưng đӃn nӝi dung và ý nghĩa cӫa câu văn. Tránh sӱ dng l p đi l p lҥi câu "nhҩn
vào đây" khi tҥo đҫu mӕi liên kӃt.
Cú pháp đӇ tҥo ra mӝt mӕi liên kӃt tӟi tài liӋu khác - liên kӃt ra ngoài - là
như sau:
<A RE¼="UR"> Nhóm tӭ đҩu mӓi liên kӁt</A>
45
V.1.3. Đͣa ch͡ tuy͟t đͩi
Khi liên kӃt tӟi mӝt tӋp nҵm ngoài máy tính cc bӝ ta phҧi nêu rõ giao thӭc
và đҫy đӫ đӏa chӍ URL cӫa tӋp đích.
<A RE¼="full UR">... </A>

Ví d:
<A RE¼="http://www.vnu.edu.vn/index.html>ÒG à Nӛi</A>
<A RE¼="http://www.srl.rmit.edu.au/sa/vicsa.html>Victorian
Subject Associations on Internet</A>
V.1.4. Đͣa ch͡ tương đͩi

NӃu liên kӃt đӃn mӝt tӋp ngay trên máy chӫ cӫa bҥn thì không cҫn dùng
đӏa chӍ URL tuyӋt đӕi mà dùng đӏa chӍ tương đӕi. Thay cho URL là tên tӋp cùng
vӟi đưӡng đүn đӃn thư mc nơi chӭa tӋp đích.
<A RE¼="path E filename">... </A>
Ví d:
<A RE¼="examples/exam .htm">Ví dӧ </A>
V.1.5. Liên k͗t nͱi t̹i ± Internal Link

Cũng có thӇ tҥo mӕi liên kӃt trong bҧn thân tài liӋu siêu văn bҧn, tӯ phҫn này
đӃn phҫn khác. ÒiӅu này rҩt có ích khi tài liӋu có kích thưӟc lӟn. Ta có thӇ tҥo mc
lc toàn bӝ nӝi dung trên phҫn đҫu trang gӗm tên các chương và liên kӃt tӯng tên
chương đӃn phҫn nӝi dung tương ӭng.
ÒӇ làm điӅu này, cҫn đánh dҩu điӇm đích - book mark- cӫa liên kӃt bҵng thҿ neo
<A NAME="Tên điӅm đích">
còn trong thҿ neo tҥi điӇm đҫu cӫa mӕi liên kӃt thì thay URL bҵng tên nói trên.
<A RE¼="Tên điӅm đích">

Lưu ý có thêm dҩu "#".
Ví d, đӇ tҥo liên kӃt nӝi tҥi tӯ đây nhҧy vӅ đҫu trang ta cҫn tҥo mӝt book
mark đҫu trang vӟi tên là Top chҷng hҥn. Sau đó, tҥo thҿ neo liên kӃt dòng
dưӟi như sau
46
<A RE¼="Top"> vӃ đҩu trang </A>
V.2. Dùng hình ҧnh làm đҫu mӕi liên kӃt
V.2.1. Thay ch· b͉ng hình
Như phҫn trên, cҩu trúc thành phҫn HTrL mӕi liên kӃt siêu văn bҧn là:
<A RE¼="Òҩu mӓi liên kӁt">
ÒӇ thay ³đҫu mӕi liên kӃt´ bi mӝt biӇu tưӧng, hay mӝt hình ҧnh... Ta chӍ
cҫn chèn mӝt hình ҧnh hay biӇu tưӧng đó vào vӏ trí cӫa ³đҫu mӕi liên kӃt´.
Ví d:
<A RE¼=´http://www.vnu.edu.vn´><IMG SRC=ógo.gif´></A>
V.2.2. Image Map - th͓ AREA
Thӱ hình dung ta có mӝt bҧn đӗ đӏa lý hành chính. Khi nhҩn chuӝt vào vùng
diӋn tích cӫa mӝt tӍnh thì mӝt trang thông tin tương ӭng vӟi tӍnh đó sӁ hiӋn ra. Òó
chính là Image rap.
Vӟi Image rap, ³đҫu mӕi liên kӃt´ là mӝt vùng trên mӝt hình ҧnh có hình
dҥng tùy ý nào đó.
Các công c soҥn thҧo trӵc quan cho phép dӉ dàng tҥo Image rap.
rӝt ví d vӅ m nguӗn HTrL cӫa thành phҫn Image rap như sau:
<MAP NAME=´Map0 ´>
<AREA RE¼=ćhapter .html´ SAPE=´rect´ coords=´, 22, 7,
9´>
<AREA RE¼=ćhapter2.html´ SAPE=ćircle´ coords=´29, 0,
3´>
<AREA RE¼=ćhapter3.html´ SAPE=´polygon´ coords=´ 23, 9,
, 2 , 278, 20 ´>
</MAP>
<IMG BORDER=´0´ SRC=ímage.gif´ WIDT=´00´ EIGT=´00´
USEMAP=´Map0 ´>
Òoҥn m trên sӁ tҥo 3 đҫu mӕi liên kӃt là ba vùng hình chӳ nhұt (rect), hình
tròn (circle) và hình tam giác (polygon) trên nӅn ҧnh image.gif. Khi nhҩn chuӝt vào
phҥm vi 3 vùng này thì các tӋp tương ӭng chapter1.html, chapter2.html và
chapter3.html sӁ đưӧc nҥp vӅ đӇ hiӇn thӏ.
47
V.3. Đưa âm thanh vào tài liӋu
V.3.1. Liên k͗t đ͗n t͟p âm thanh
ÒӇ chèn mӝt đoҥn âm thành vào tài liӋu HTrL ta cũng theo đúng quy tҳc
tҥo mӕi liên kӃt thông thưӡng. Trong thҿ neo, tҥi đӏa điӇm URL bây giӡ là đӏa chӍ
cӫa tӋp âm thanh.
Dưӟi đây là mӝt ví d vӅ viӋc chèn âm thành vào tài liӋu. Khi nhҩn chuӝt
vào mӕi liên kӃt này, tӋp âm thanh sӁ đưӧc phát lҥi.
<A RE¼=´music/papa.rmi´>Papa</A>
V.3.2. T̹o âm thanh n͙n
Không nhӳng có thӇ chèn tӋp âm thanh vào tài liӋu HTrL mà còn có thӇ
nhúng âm thanh vào tài liӋu, nghĩa là âm thanh nӅn phát ra khi trang tài liӋu bҳt đҫu
hiӇn thӏ.
ÒӇ nhúng âm thanh vào tài liӋu ta dùng thҿ
<EMBED SRC=ÚR´ EIGT=ń´ WIDT=ń¶
AUTOSTART=true|false OOP=true|false>
Trong đó:
Thuӝc tính Mô tҧ
SRC=ÚR´ Òưӡng dүn đӃn tӋp âm thanh
ChiӅu cao cӫa khung nhìn cho giao diӋn điӅu
EIGT=n
khiӇn cӫa phҫn mӅm phát âm thanh
ChiӅu rӝng cӫa khung nhìn cho giao diӋn điӅu
WIDT=n
khiӇn cӫa phҫn mӅm phát âm thanh
Âm thanh tӵ đӝng đưӧc kích hoҥt khi bҳt đҫu
AUTOSTART=true|false
nҥp tài liӋu hiӋn thӏ (nên đ t là true)
OOP=true|false ThiӃt lұp viӋc l p lҥi nhiӅu lҫn hay chӍ mӝt lҫn
Ò t thҿ <EMBED> đâu thì khung nhìn cӫa giao diӋn điӅu khiӇn viӋc phát
tӋp âm thanh xuҩt hiӋn đó.
Ví d:
<EMBED SRD=´music/papa.rmi´ EIGT=0 WIDT=200
AUTOSTART=true OOP=true>
48
V.4. Đưa Video vào tài liӋu
V.4.1. Chèn t͟p Video
ViӋc chèn tӋp video vào tài liӋu HTrL cũng giӕng như chèn tӋp âm thanh.
Ví d đoҥn m sau đây sӁ chèn mӝt đoҥn phim video vào tài liӋu. Nó sӁ tҥo
ra mӝt mӕi liên kӃt tӟi tӋp video đ chӑn và khi ta nhҩn chuӝt vào mӕi liên kӃt thì
sӁ đưӧc xem lҥi tӋp video đó.
<A RE¼=´film.mpg´>¼ilm</A>
Chú ý: Các tӋp video đӅu có kích thưӟc khá lӟn nên h y cân nhҳc vӅ tӕc đӝ
đưӡng truyӅn cӫa ngưӡi dùng.
V.4.2. Nhúng t͟p video
Thҿ <EMBED> cũng dùng đӇ nhúng tӋp video vào tài liӋu:
Ví d:
<EMBED SRC=´film/film.mov´ EIGT= WIDT= 0>
Cũng tương tӵ như các thuӝc tính cӫa viӋc chèn tӋp âm thanh:
SRC=ÚR´ Tên và đưӡng dүn đӃn tӋp video
EIGT=n ChiӅu cao cӫa khung hình chiӃu video
WIDT=n ChiӅu rӝng cӫa khung hình chiӃu video
Ò t cho video tӵ chҥy khi bҳt đҫu nҥp tài liӋu
AUTOPAY=true|false
(không bҳt buӝc)
Cho hiӋn giao diӋn điӅu khiӇn cӫa phҫn mӅm
CONTROER=true|flase video liӅn ngay phía dưӟi khung hình. Thuӝc
tính này không bҳt buӝc. r c đӏnh là true.
OOP=true|false ThiӃt lұp viӋc l p lҥi nhiӅu lҫn hay chӍ mӝt lҫn
Vӏ trí đ t thҿ <EMBED> là nơi xuҩt hiӋn khung hình video.
49
?ài tұp
1.p Tҥo mӝt trang khác giӟi thiӋu chi tiӃt hơn vӅ mình và có liên kӃt tӟi trang
giӟi thiӋu chính cӫa mình.
2.p Chèn 2 ҧnh vào trong trang giӟi thiӋu chính sao cho khi click vào ҧnh đó thì
trang giӟi thiӋu chi tiӃt đưӧc m ra. Yêu cҫu: ҧnh thӭ nhҩt sӱ dng đưӡng
dүn tuyӋt đӕi, ҧnh thӭ hai sӱ dng đưӡng dүn tương đӕi tӟi trang cҫn liên kӃt.
3.p Tҥo mӝt trang thӭ ba trong đó có chèn mӝt đoҥn Video clips giӳa trang.
50
CHƯƠNG VI. ? TRÍ NӄN V KHUNG
VI.1. Màu nӅn và văn bҧn

VI.1.1. Đ͏t màu n͙n
ÒӇ văn bҧn tr nên đҽp và hҩp dүn, đôi khi đ t nӅn cho trang siêu văn bҧn.
Thuӝc tính BGCOORp +,-./*p R/0. Dùng thuӝc tính này kèm thҿ
<BODY> đӇ đ t màu nӅn cho văn bҧn. Cú pháp như sau:
<BODY BGCOOR="rrggbb">
Nӛi dung cөa tài liӉu
</BODY>
trong đó "#rrggbb" là red-green-blue, bӝ ba sӕ hai chӳ sӕ hӋ đӃm 16, xác đӏnh m

màu.
VI.1.2. Màu ch· cͿa văn b̻n
Thuӝc tính TEXT Thuӝc tính này đӇ thiӃt lұp màu cho các con chӳ trong văn
bҧn, trӯ các đҫu mӕi liên kӃt phҧi có màu khác đi.
<BODY TEXT="rrggbb">
</BODY>Ғ
VI.1.3. Màu cͿa đ̿u mͩi liên k͗t - Thuͱc tính LINK, VLINK và ALINK
Ba thuӝc tính trên đӇ đ t màu cӫa các đҫu mӕi siêu liên kӃt.
Ëp INK - đ t màu hiӇn thӏ trưӟc khi nhҩn chuӝt vào đӇ đӃn thăm đích liên kӃt.
Ëp VINK - Ò t màu sau khi đích liên kӃt đ đưӧc đӃn thăm (visitedã.
Ëp AINK - đ t màu khi bҥn kích hoҥt, đang nhҩn chuӝt vào (activeã
Các màu m c đӏnh là: INK=blue, VINK=purple and AINK=red
<BODY INK="rrggbb" VINK="rrggbb" AINK="rrggbb">

</BODY>p
KӃt hӧp cùng vӟi nhau
51
<TM>
<EAD>
<TITE>Color Control Example</TITE>
</EAD>
<BODY BGCOOR="000000" TEXT="¼0¼0¼0" INK="¼¼¼¼00"
VINK="22AA22" AINK="0077¼¼">
Òây là mӛt tài liӉu làm ví dӧ vӃ thiӁt đҹt màu. Các
chӱ màu xám sáng trên nӃn đen, và <A
RE¼="nowhere.htm">đҩu mӓi liên kӁt</A> đҩu tiên có màu
vàng, chuyӅn màu xanh lá cây sáng khi đưӥc kích hoңt và
có màu xanh nhңt khi điӅm đích đã đưӥc thăm
</BODY>
</TM>
Lưu ý: Tә hӧp màu như trên chӍ đưӧc thiӃt đ t mӝt lҫn cho toàn văn bҧn.
H y thұn trӑng khi lӵu chӑn đӇ đҧm bҧo dӉ đӑc, dӉ nhìn.
VI.1.4. Thuͱc tính và mã màu
<BODY BGCOOR="rrggbb" TEXT="rrggbb" INK="rrggbb"
VINK="rrggbb" AINK="rrggbb">
p
BGCOOR Ò t màu nӅn
TEXT Ò t màu các con chӳ, trӯ các mӕi nӕi.
Ò t màu ban đҫu cӫa đҫu mӕi liên kӃt khi chưa kích
INK
hoҥt
VINK Ò t màu đҫu mӕi liên kӃt khi đ thăm đích
AINK Ò t màu đҫu mӕi liên kӃt khi kích hoҥt
rӝt vài m màu hay dùng:

Màu Mã
black #000000
white #FFFFFF
pale grey #DBDDE5
dark green #306020
green #405060
pale blue/green #00FFFF
pale blue #A5D6F7
navy blue #000020
52
burgundy #800040
yellow #FFFF00
purple #601050
red #FF0000
orange red #FF2400
orange #FF7F00
neon blue #4D4DFF
pale purple/orchid #9370DB
maroon #8E236B
scarlet #8C1717
pale purple #6B238E
firebirch #8E2323
Tuy nhiên hiӋn nay nhiӅu trình duyӋt chҩp nhұn dùng tên màu tiӃng Anh
thay cho các chӳ sӕ rҩt khó nhӟ trên.
VI.2. Nҥp hình ҧnh làm nӅn cho trang văn bҧn
VI.2.1. Thuͱc tính BACKGROUND
Có thӇ dùng thuӝc tính này đӇ tҥo mӝt ҧnh nӅn cho trang tài liӋu siêu văn
bҧn. Thay cho xác đӏnh màu ta cҫn chӍ ra tên tӋp hình ҧnh kèm đưӡng dүn.
<BODY BACKGROUND ="đưӟng dҭn tӝi tӉp ҥnh">

Nӛi dung tài liӉu
</BODY>Ғp
Ví d:
<BODY BACKGROUNDH"images/backgnd.gif">
p
Khi dùng ҧnh làm nӅn cho trang Web cҫn phҧi nҥp mӝt tӋp hình ҧnh. Như ta
đ biӃt tӋp ҧnh thưӡng có kích thưӟc lӟn, làm chұm viӋc hiӇn thӏ trang tài liӋu. Do
đó cҫn chӑn tӋp ҧnh có kích thưӟc nhӓ làm ҧnh nӅn. Toàn bӝ trang văn bҧn sӁ đưӧc
"lát nӅn" bҵng hình ҧnh này như ta lát nӅn nhà bҵng gҥch hoa.
VI.2.2. Water mark
NhiӅu trang web có nӅn trang trí gҳn ch t cӕ đӏnh, còn phҫn văn bҧn sӁ cuӝn
trôi bên trên mӛi khi ta di chuyӇn thanh trưӧt. HiӋu ӭng này đưӧc tҥo ra nhӡ thiӃt
lұp thêm thuӝc tính cho ҧnh nӅn là
53
bgproperties="fixed"
Ví d:pp
1,234p,5R67829)3H
-:;-.* < p
bgproperties="fixed"=p
VI.2.3. Hãy ký tên vào tài li͟u cͿa mình
rӝt thông lӋ nên tuân theo là "kí tên" vào tài liӋu. Nó giúp cho ngưӡi đӑc
biӃt đưӧc nhӳng thông tin tӕi thiӇu vӅ tác giҧ soҥn ra tài liӋu, thӡi gian cұp nhұt...
ViӋc đưa thêm đӏa chӍ cӫa tài liӋu Web vào cuӕi trang sӁ giúp cho ngưӡi đӑc lưu lҥi
đưӧc xuҩt xӭ cӫa trang tài liӋu. Òó là chưa nói đӃn ý nghĩa quan trӑng cӫa phҫn
chӳ kí này trong các tài liӋu chính thӭc ho c có tính thương mҥi.
Phҫn chӳ kí thưӡng gӗm các thông tin sau:
Ëp Ngày khi tҥo lҫn đҫu.

Ëp Ngày sӱa chӳa cұp nhұt gҫn nhҩt.
Ëp Tên (và e-mail) cӫa tác giҧ
Ëp Tuyên bӕ vӅ bҧn quyӅn (nӃu cҫn )
Ëp URL
Òoҥn m HTrL cӫa phҫn chӳ kí đҥi loҥi có thӇ như sau:
<R SIZE= >

<¼ONT SIZE=- >
Ngày viӁt: 20 September 998 
Ngày cүp nhүt: 20 October 200 
Tác giҥ: <A RE¼="mailto:webmaster@vitti.vnu.edu.vn">
NguyӇn Văn ùng</A> email:
webmaster@vitti.vnu.edu.vn"> 

Copyright Ecopy; ViӉn Òào tңo công nghӉ thông tin -
VITTI, ÒG à nӛi, 998.
<R SIZE= >
UR: http://www.vnu.edu.vn/index.htm
</¼ONT>Ғ
54
Thҿ <A RE¼="mailto:webmaster@vitti.vnu.edu.vn">...
</A> là mӕi liên kӃt đӃn dӏch v thư điӋn tӱ, khi trӓ chuӝt vào đây sӁ kích hoҥt
dӏch v e-mail đӇ gӱi đӃn đӏa chӍ nêu sau lӋnh mailto.
H y tұp thói quen thêm chӳ kí vào tài liӋu cӫa mình!
VI.3. Khung ± Frames
HTrL có các thҿ trình bày cho phép chia vùng hiӇn thӏ cӫa cӱa sә trình
duyӋt thành nhiӅu khung, mӛi khung là mӝt cӱa sә đӝc lұp, hiӇn thӏ mӝt tài liӋu
HTrL khác nhau.
Khung cho phép ngưӡi thiӃt kӃ hiӇn thӏ đӗng bӝ nhiӅu tài liӋu HTrL khác
nhau đӇ tiӋn theo dõi, so sánh. Ví d, trong khung bên trái hiӇn thӏ các nút bҩm, còn
khung bên phҧi hiӇn thӏ tài liӋu tương ӭng.
VI.3.1. Trang trí khung
Trang HTrL thӵc hiӋn bày trí các khung (gӑi là frameset document) có cҩu
trúc khác trang thông thưӡng, không có khung.
Trang thưӡng có 2 phҫn, EAD và BODY. Trang bày trí khung có EAD và
¼RAMESET thay cho BODY.
Thành phҫn ¼RAMESET tә chӭc các khung trong cӱa sә trình duyӋt. Nó cũng
có thӇ chӭa thҿ NO¼RAMES đӇ xӱ lí trưӡng hӧp trình duyӋt không hӛ trӧ frame.
Các thành phҫn thông thưӡng khác vӕn nҵm trong BODY không đưӧc xuҩt
hiӋn trưӟc thҿ m ¼RAMESET. NӃu không, thành phҫn ¼RAMESET sӁ bӏ bӓ qua.
Ví d:
Dưӟi đây là mӝt ví d đơn giҧn.
<TM>
<EAD>
<TITE>A simple frameset document</TITE>
</EAD>
<¼RAMESET cols="20%, 80%">
<¼RAMESET rows=" 00, 200">
<¼RAME src="frame .html">
<¼RAME src="frame2.gif">
55
</¼RAMESET>
<¼RAME src="frame3.html">
<NO¼RAMES>
This frameset document contains:
.....
</NO¼RAMES>
</¼RAMESET>
</TM>
Òoҥn m trên sӁ tҥo 3 khung, đưӧc bài trí như dưӟi đây.
Hình VI.1. K͇t qu̫ ch̩y đo̩n code ví dͭ

Khi trình duyӋt khách không hӛ trӧ khung thì các khung sӁ không đưӧc hiӇn
thӏ mà thành phҫn NO¼RAMES sӁ đưӧc xӱ lí.
VI.3.2. Thành ph̿n FRAMESET
Thҿ ¼RAMESET dùng đӇ phân chia vùng hiӇn thӏ trong cӱa sә trình duyӋt
thành các khung hình chӳ nhұt. rӛi khung hình chӳ nhұt gӑi là mӝt frame, đưӧc
đӏnh nghĩa bҵng thҿ ¼RAME.
a. Các thuӝc tính và ví dө minh hӑa
rows = Danh sách các đӝ cao cӫa các khung
56
Danh sách gӗm nhiӅu phҫn tӱ, cách nhau dҩu phҭy. rӛi phҫn tӱ xác đӏnh đӝ
cao (sӕ dòng !) cӫa mӝt khung. Chia chiӅu đӭng thành bao nhiêu khung thì danh
sách có bҩy nhiêu phҫn tӱ.
ChiӅu cao thӇ hiӋn bҵng

- sӕ pixel,
- tӹ lӋ phҫn trăm chiӅu cao màn hình
- hay tӹ lӋ phҫn chiӅu cao còn lҥi.
Giá trӏ m c đӏnh là 100%, tӭc chӍ có mӝt khung theo chiӅu ngang.
cols = Danh sách các đӝ rӝng cӫa các khung.
ý nghĩa tương tӵ như trên.
Giá trӏ m c đӏnh là 100%, tӭc chӍ có mӝt khung theo chiӅu dӑc.
Thuӝc tính row thiӃt lұp viӋc chia khung theo chiӅu ngang trong mӝt
frameset. NӃu không đӏnh nghĩa, thì các cӝt trong khung sӁ chiӃm toàn bӝ chiӅu
cao vùng hiӇn thӏ.
Thuӝc tính cols thiӃt lұp viӋc chia khung theo chiӅu đӭng trong mӝt
frameset. NӃu không đӏnh nghĩa, thì các dòng trong khung sӁ chiӃm toàn bӝ chiӅu
rӝng vùng hiӇn thӏ.
Phӕi hӧp hai thuӝc tính sӁ tҥo ra ô lưӟi các khung.
Các ví d.
1- Chia màn hình thành hai nӱa: nӱa trên và nӱa dưӟi:
<¼RAMESET rows="0%, 0%">
ßßß

ßßß
</¼RAMESET>
2- Chia màn hình thành 3 cӝt. Cӝt giӳa rӝng 250 pixels. Cӝt đҫu chiӃm 25% cӫa
phҫn còn lҥi và cӝt thӭ 3 chiӃm 75% cӫa phҫn đӝ rӝng còn lҥi.
<¼RAMESET cols=" ,20,3">
ßßß

ßßß
</¼RAMESET>
3- Tҥo lưӟi gӗm 2 x 3 = 6 khung.
<¼RAMESET rows="30%,70%" cols="33%,3%,33%">
ßßß

ßßß
57
</¼RAMESET>
4- Chia chiӅu đӭng màn hình thành 4 khung. Khung thӭ nhҩt chiӃm 30% cӫa chiӅu
cao vùng hiӇn thӏ. Khung thӭ hai có chiӅu cao cӕ đӏnh 400 pixel. Dҩu sao có nghĩa
là hai khung thӭ 3, thӭ 4 chia nhau phҫn còn lҥi. Khung thӭ 4 có chiӅu cao là "2*",
gҩp đôi khung thӭ 3 (vì "*" tương đương vӟi 1*).
NӃu chiӅu cao vùng hiӇn thӏ là 1000 pixel thì đӝ cao cӫa các khung 1,2,3,4
lҫn lưӧt là: 300, 400, 100, 200 pixel !.
<¼RAMESET rows="30%,00,,2">
ßßß

ßßß
</¼RAMESET>
b. Chia khung lӗng nhau và thành phҫn FRAME

ViӋc chia khung có thӇ lӗng nhau nhiӅu mӭc.
Ví d: chia chiӅu rӝng thành 3 khung đӭng, sau đó khung giӳa lҥi đưӧc
chia thành 2 phҫn trên và dưӟi.
<¼RAMESET cols="33%, 33%, 3%">
.ßß

ßßß
<¼RAMESET rows="0%, 0%">
.ßß

ßßß
.ßß

ßßß
</¼RAMESET>
.ßß

ßßß
</¼RAMESET>
Thҿ FRArE đӏnh nghĩa mӝt khung hình c thӇ (trong nhiӅu khung hình cӫa
frameset).
Các thuӝc tính:
name = Tên cӫa khung.
Có thӇ dùng tên này đӇ làm đích cӫa mӕi siêu liên kӃt.
src = URI
Trӓ đӃn trang tài liӋu sӁ hiӇn thӏ trong khung.
58
noresize
Không cho phép co gi n lҥi kích thưӟc
scrolling = auto|yes|no
ThiӃt lұp thanh cuӝn.
Ëp auto: Xuҩt hiӋn thanh cuӝn khi cҫn thiӃt. Òây là giá trӏ m c đӏnh.
Ëp yes: Luôn có thanh cuӝn.
Ëp no: Luôn không có thanh cuӝn.
/rameborder = |0
ThiӃt lұp đưӡng biên.
Ëp : Có đưӡng biên giӳa khung đang xét vӟi các khung kӅ nó. Òây là giá trӏ
m c đӏnh.
Ëp 0: Không có đưӡng biên giӳa khung đang xét vӟi các khung kӅ nó.
marginwidth = sӕ pixel
ThiӃt lұp đӝ rӝng lӅ chiӅu rӝng = khoҧng trӕng giӳa phҫn hiӇn thӏ nӝi dung
và biên trái, biên phҧi. Giá trӏ m c đӏnh tuǤ theo bӝ duyӋt.
marginheight = sӕ pixel
ThiӃt lұp đӝ rӝng lӅ chiӅu cao = khoҧng trӕng giӳa phҫn hiӇn thӏ nӝi dung và
biên trên, biên dưӟi. Giá trӏ m c đӏnh tuǤ theo trình duyӋt.
Lưu ý: Nӝi dung trong mӝt frame không đưӧc thuӝc vӅ chính trang tài liӋu
đӏnh nghĩa frameset.
VI.4. ThiӃt lұp Target, thҿ NOFRAME và IFRAME
VI.4.1. Thi͗t lͅp Target
Thuӝc tính target là đӇ xác đӏnh tӋp tài liӋu HTrL sӁ hiӇn thӏ trong khung.
target = tên khung đích.
ThiӃt lұp tên cӫa khung mà tài liӋu sӁ m ra trong khung đó.
Thuӝc tính này dùng vӟi các thành phҫn tҥo mӕi liên kӃt: (A, INK),
image map (AREA), và ¼ORM.
59
VI.4.2. Th͓ NOFRAMES
Thành phҫn NO¼RAMES thiӃt lұp nӝi dung cҫn hiӇn thӏ khi trình khách
không hӛ trӧ frame ho c đ tҳt chӭc năng hiӇn thӏ frame.
Thành phҫn NO¼RAMES đ t phҫn cuӕi cӫa thành phҫn ¼RAMESET.
Ví d:
<TM>
<EAD>
<TITE>A frameset document with NO¼RAMES</TITE>
</EAD>
<¼RAMESET cols="0%, 0%">
<¼RAME src="main.html">
<¼RAME src="table_of_contents.html">
<NO¼RAMES>
ere is the <A href="main-noframes.html">
non-frame based version of the document.</A>
</NO¼RAMES>
</¼RAMESET>
</TM>
VI.4.2. Nhúng frame - th͓ IFRAME
Thành phҫn I¼RAME cho phép ngưӡi thiӃt kӃ chèn mӝt frame vào giӳa mӝt
khӕi văn bҧn text và hiӇn thӏ mӝt tài liӋu HTrL khác bên trong.
Thuӝc tính SRC thiӃt lұp tài liӋu nguӗn đӇ hiӇn thӏ trong frame.
Rác thuӝc tính:
name = tên. đӇ tham chiӃu trong tài liӋu
width = Òӝ rӝng cӫa inline frame.
height = Òӝ cao cӫa inline frame.
Ví d:
<I¼RAME src="foo.html" width="00" height="00"
scrolling="auto" frameborder=" ">
[Your user agent does not support frames or is
currently configured
not to display frames. owever, you may visit
<A href="foo.html">the related document.</A>]
</I¼RAME>
60
Inline frames m c đӏnh là không co gi n đưӧc, không cҫn phҧi nêu rõ noresize.
?ài tұp
1.p Sӱa trang giӟi thiӋu tóm tҳt vӅ mình sao cho nӅn cӫa trang đó là mӝt ҧnh bҩt
kǤ, trang giӟi thiӋu chi tiӃt có nӅn màu xanh nưӟc biӇn nhҥt.
2.p Dùng thҿ IFRArE đӇ nhúng trang thӭ 3 vào trong trang giӟi thiӋu tóm tҳt
(trang chӫ).
61
CHƯƠNG VII. ?IӆU MҮU STLE V CASCADING STLE SHEET
VII.1. FORM
VII.1.1. FORM là gì?
a. Rhӭc năng cӫa FORM
ÒӇ m rӝng khҧ năng phc v ngưӡi sӱ dng, dӏch v Web cҫn phҧi sӱ dng
các ӭng dng khác bên ngoài. Ví d NSD yêu cҫu tìm kiӃm trong cơ s dӳ liӋu, lҩy
các thông tin tӭc thӡi, luôn đưӧc cұp nhұt.... ÒӇ làm đưӧc điӅu này dӏch v Web
phҧi chuyӇn yêu cҫu cӫa NSD đӃn mӝt ӭng dng khác. Ӭng dng này sӁ thӵc hiӋn
yêu cҫu và trҧ lҥi kӃt quҧ cho Web server đӇ chuyӇn tiӃp đӃn NSD.
Form là mӝt cách đӇ chuyӇn dӳ liӋu tӯ NSD đӃn cho Web Server xӱ lý.
Forms đưӧc sӱ dng rӝng r i trên WWW. Các forms rҩt tiӋn lӧi cho ngưӡi dùng
điӅn các yêu cҫu tìm kiӃm, các biӇu mүu điӅu tra, nhұp dӳ liӋu đҫu vào cho các ӭng
dng..
Có nhiӅu thành phҫn khác nhau (gӑi là các điӅu khiӇn control) trong mӝt
form. TuǤ theo yêu cҫu giao tiӃp vӟi NSD cҫn chӑn thành phҫn thích hӧp nhҩt.
Khi tҥo form bҥn cũng cҫn phҧi chӍ rõ cho máy chӫ dӏch v biӃt cách xӱ lý
form. Có nhiӅu loҥi chương trình ӭng dng khác nhau trong máy chӫ dӏch v đӇ
làm viӋc này: các chương trình CGI, ISAPI, các script ASP, JSP, Java Bean,
Servlet...
Tҥo form là khâu đҫu tiên trong viӋc xây dӵng giao tiӃp giӳa NSD vӟi các
ӭng dng Internet / Intranet.
b. Thành phҫn cӫa FORM
C p thҿ đӇ tҥo Form là <¼ORM...>...</¼ORM>
rӑi thành phҫn cӫa form như sӁ trình bày dưӟi đây đӅu phҧi nҵm trong
phҥm vi giӟi hҥn bi c p thҿ này.
Công thӭc khung đӇ tҥo form là:
<¼ORM METOD=POST ACTION="UR">
Toàn bô cac thanh phân khac bên trong form nm ây
</¼ORM>
p
62
Thuӝc tính METOD chӍ ra phương thӭc trao đәi dӳ liӋu giӳa trình duyӋt Web
và máy chӫ Web. Có 2 phương thӭc là POST, GET. Òӕi vӟi form phương thӭc
thưӡng là POST.
Thuӝc tính ACTION đӇ thiӃt lұp đӏa chӍ URL cӫa chương trình sӁ nhұn và xӱ
lý dӳ liӋu gӱi tӯ form.
VII.1.2.Các thành ph̿n trong FORM
Như đ nêu trên, có nhiӅu loҥi thành phҫn khác nhau trong mӝt Form. Dưӟi
đây sӁ trình bày lҫn lưӧt nhӳng điӇm cơ bҧn nhҩt.
a. Hӝp văn bҧn ± TextBox
Hӝp văn bҧn là nơi đӇ gõ vào mӝt dӳ liӋu kiӇu xâu kí tӵ. Hӝp văn bҧn sӁ
đưӧc hiӇn thӏ như sau:
Bottom of Form 1
Thҿ đӇ tҥo ra nó là:

<INPUT TYPE="TEXT" NAME="÷ " SIZE="n">
Trong đó TEXT là tӯ khoá ӭng vӟi kiӇu là Text box, Tên là tên cӫa hӝp văn
bҧn này còn n là mӝt sӕ nguyên chӍ ra chiӅu dài cӫa trưӡng. Tên phҧi duy nhҩt
trong trang, không đưӧc trùng nhau.
b. Hӝp mұt khҭu ± Password
Hӝp mұt khҭu là nơi đӇ gõ vào mӝt mұt khҭu kiӇu xâu kí tӵ. Hӝp mұt khҭu
đưӧc hiӇn thӏ như sau:
Thҿ đӇ tҥo ra nó là:

<INPUT TYPE="PASSWORD" SIZE="n">
Trong đó PASSWORD là tӯ khoá đӇ tҥo hӝp mұt khҭu, n là sӕ nguyên chӍ ra

chiӅu dài cӫa hӝp.
Hӝp mұt khҭu khác hӝp văn bҧn chӛ khi gõ các kí tӵ tӯ bàn phím thì nó
không hiӇn thӏ kí tӵ tương ӭng trong khung mà thay bҵng các dҩu sao *.
63
Lưu ý: ViӋc hiӇn thӏ kí tӵ dҩu * đӇ thay thӃ chӍ có tác dng che giҩu vӟi
ngưӡi nhìn tҥi máy cc bӝ. Password vүn đưӧc gӱi vào mҥng dưӟi dҥng rõ, không
m hoá, có thӇ bӏ xem trӝm. NhiӋm v m là cӫa giao thӭc mҥng.
c. Vùng văn bҧn ± Text Windows
Vùng văn bҧn, đӇ hiӇn thӏ nhiӅu dòng văn bҧn. Vùng văn bҧn có dҥng như sau:
Công thӭc viӃt là:

<TEXTAREA NAME= OTenVung" ROWS=m COS=n> Van ban hien
thi</TEXTAREA>
trong đó, Tên vùng là tên cӫa vùng văn bҧn, m và n là các sӕ nguyên, chӍ ra chiӅu
cao và chiӅu rӝng cӫa vùng văn bҧn. NӃu bҥn đӇ trӕng phҫn "đoҥn văn bҧn sӁ hiӇn
thӏ " thì sӁ không có văn bҧn nào xuҩt hiӋn trong cӱa sә.
Ví d:
<TEXTAREA NAME="COMMENTS" ROWS= COS=0> Bңn cҩn phҥi
thưӟng xuyên cүp nhүt các mҭu virus mӝi nhҧt</TEXTAREA>
d. Rác lӵa chӑn ± Radio Button
Các nút chӑn radio là mӝt nhóm nút tròn, chӍ cho phép bҥn đưӧc chӑn mӝt
trong nhiӅu nút. Nút radio có dҥng như sau:
Công thӭc viӃt:

<INPUT TYPE="RADIO" NAME="Tên_nhóm_nút"
VAUE="giá_trӍ_đưӥc_chӏn"> Nhãn nút
Trong đó RADIO là tӯ khoá ӭng vӟi kiӇu nút chӑn Radio, nhãn nút i là xâu kí tӵ
sӁ xuҩt hiӋn cҥnh nút.
Ví d:
64
Òoҥn m đӇ tҥo nút radio đҫu tiên - rastercard - là:
<INPUT TYPE="RADIO" NAME="PAYMENT"
VAUE="Mastercard">Master Card
Trong ví d trên, thuӝc tính NAME đưӧc gán trӏ PAYMENT là tên nhóm nút
Radio, gӗm 3 nút cho phép lӵa chӑn mӝt trong 3 cách thanh toán, thuӝc tính VAUE
đӇ nhұn kӃt qӫa câu trҧ lӡi ӭng vӟi lӵa chӑn "rastercard". Lưu ý phân biӋt giӳa
rastercard là giá trӏ cӫa lӵa chӑn vӟi rastercard là nh n nút, tӭc cm chӳ hiӋn
cҥnh nút radio. Ta có thӇ thay nh n nút bҵng mӝt xâu bҩt kì, ví d "Thҿ tín dng
rasterCard".
Dĩ nhiên cӭ mӝt nút radio lҥi tương ӭng vӟi mӝt dòng m HTrL như trên.
Lưu ý rҵng thuӝc tính NArE phҧi như nhau cho toàn bӝ các nút radio cӫa cùng
mӝt nhóm. Trong ví d trên thì tҩt cҧ các nút đӅu phҧi cùng có NAME =[PAYMENT].
Trong mӝt nhóm nút radio, mӝt nút có thӇ có thuӝc tính CECKED, nghĩa là
nó đưӧc đánh dҩu chӑn sҹn khi m trang Web.
e. đánh dҩu ± RheckBoxes
Ô đánh dҩu, đӇ đánh dҩu mӝt ho c vài lӵa chӑn. Ô dánh dҩu có dҥng như
sau:
Công thӭc viӃt:
<INPUT TYPE="checkbox" NAME="Tên nhóm nút" VAUE="giá

trӍ đưӥc chӏn"> Nhan o i
Ví d:
65
Khác vӟi nút radio bҥn có thӇ đánh dҩu chӑn nhiӅu ô đӗng thӡi trong cùng
mӝt nhóm ô đánh dҩu.
Ví d công thӭc đӇ tҥo ra checkbox đҫu tiên trên là:
<INPUT TYPE="CECKBOX" NAME="DEIVERY"
VAUE="Overnight">Overnight ý nghĩa cөa các thuӛc tính
cũng tương tӳ như cөa nút radio.
Trong mӝt nhóm ô đánh dҩu, mӝt sӕ ô có thӇ có thuӝc tính CECKED và đưӧc
đánh dҩu chӑn sҹn khi m trang Web.
f. Danh sách lӵa chӑn ± thành phҫn SELERT
Công thӭc đӇ tҥo menu là:

<SEECT NAME="MENU" SIZE="">
<OPTION>Menu item
<OPTION>Menu item 2
<OPTION SEECTED>Menu item 3
<OPTION>Menu item
<OPTION>Menu item
<OPTION>Menu item
<OPTION>Menu item 7
<OPTION>Menu item 8
</SEECT>
trong đó thuӝc tính SIZE xác đӏnh sӕ mc chӑn có thӇ nhìn thҩy trong cӱa sә cuӝn.
OPTION SEECTED xác đӏnh lӵa chӑn m c đӏnh ban đҫu.
Có thӇ tҥo menu buông xuӕng có dҥng như sau nӃu ta đ t thuӝc tính
SIZE= :
ÒӇ tҥo bҧng chӑn kiӇu này chӍ cҫn bӓ thuӝc tính SIZE trong đoҥn m trên.
r c đӏnh, danh sách chӑn SEECT chӍ cho phép chӑn mӝt mc chӑn. Thuӝc
tính MUTIPE cho phép đánh dҩu chӑn nhiӅu mc.
g. Hӝp chӑn tӋp
66
Cho phép hiӇn thӏ hӝp chӑn tӋp ho c nhұp tên tӋp trӵc tiӃp. Ví d.
Khi nhҩn chuӝt vào nút Browse thì hӝp thoҥi Choose File sӁ m và cho phép
chӑn tӋp.
Cách viӃt:
<INPUT TYPE="¼IE"ҒNAME="fileName">
Khi nhұp tên tӋp vào trưӡng text hay chӑn tӋp (bҵng nút Browse) thì tên tӋp
sӁ đưӧc gán cho thuӝc tính VAUE cӫa thành phҫn này.
h. Nút Send và Rlear
Khi ngưӡi sӱ dng đ điӅn xong thì phҧi ho c gӱi kӃt quҧ đi, ho c xoá sҥch
và điӅn lҥi tӯ đҫu:
Send - gӱi kӃt quҧ đi.
Clear - xoá sҥch và làm lҥi tӯ đҫu.
Hai nút đӇ làm viӋc này có dҥng:
r đӇ tҥo ra hai nút này là:

<INPUT TYPE="SUBMIT" VAUE="Send form">
<INPUT TYPE="RESET" VAUE="Clear form">
trong đó hai xâu kí tӵ trong ngo c kép Send form, Clear form gán cho thuӝc tính
VAUE sӁ hiӇn thӏ trên nút tương ӭng. Dĩ nhiên ta có thay bҵng xâu nào khác tuǤ ý,
chҷng hҥn ³gӱi đi´, ³điӅn lҥi´.
i. Nút nhҩn ± Push Button
Ngoài hai nút kiӇu "Submit" và "Reset" luôn gҳn vӟi form và có chӭc năng
quy đӏnh trưӟc như trên, có thӇ tҥo nút nhҩn đӇ gҳn vӟi nhӳng hành đӝng xӱ lí khác
do ta tӵ thiӃt kӃ. r nguӗn đӇ tҥo nút nhҩn tәng quát kiӇu này là.
<Button type="button" name="Tên nút"> Nhãn nút
</BUTTON>
67
Tên nút đӇ tham chiӃu, còn nhãn nút là nh n sӁ hiӇn thӏ trên nút. NӃu muӕn
trang trí mӝt biӇu tưӧng hay hình ҧnh trên nút chӍ cҫn thay thӃ phҫn nhãn nút bҵng
hình ҧnh.
<BUTTON type="button" name="Tên nút"><IMG SRC="TӉp
ҥnh" AT="Dòng chӱ thay thӁ"></BUTTON>
Lưu ý: phҧi cung cҩp dòng chӳ thay thӃ cho thành phҫn IMG. Không đưӧc
gҳn mӝt image map vӟi thành phҫn IMG chӭa trong mӝt thҿ BUTTON.
ÒӇ gҳn các hàm chӭc năng xӱ lí vӟi mӝt nút nhҩn, ta dùng các thuӝc tính vӅ
sӵ kiӋn nӝi tҥi cӫa nút như onclick, ondblclick, onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout... Phҫn
trình bày vӅ Scripting sӁ nêu rõ vҩn đӅ này.
_. Nút nhҩn bҵng hình ҧnh
Có thӇ tҥo nút nhҩn trӵc tiӃp bҵng mӝt hình ҧnh.
<INPUT type="image" NAME = "Tên nút" SRC="Tên ҥnh">
Khi nhҩn nút, form đưӧc gӱi đi cùng vӟi các toҥ đӝ x,y tính bҵng pixel, kӇ
tӯ góc trên - trái cӫa hình ҧnh. Các sӕ liӋu này đưӧc gӱi đi dưӟi dҥng.
name.x=x-value name.y=y-value
đây name là giá trӏ cӫa thuӝc tính name cӫa nút; x-value, y-value là các toҥ đӝ.
NӃu viӋc xӱ lí khác nhau ph thuӝc toҥ đӝ cӫa điӇm nhҩn chuӝt mà trình
khách không hӛ trӧ hình ҧnh thì phҧi dùng giҧi pháp khác: dùng nhiӅu button ho c
image map và script.
k. Rác trưӡng ҭn
Các trưӡng ҭn không hiӇn thӏ trên form nhưng đưӧc dùng đӇ gӱi thông tin
cho Server.
Ví d:
<INPUT TYPE="IDDEN" NAME="previous-url" VAUE="UR">
Òoҥn m trên đӇ tҥo mӝt liên kӃt trên trang cho phép NSD nhҩn nút đӇ tӟi
mӝt trang Web tҥi đӏa chӍ URL nhҩt đӏnh nào đó chӭ không phҧi dùng phím BACK.
68
rӝt ví d nӳa là đӇ điӅn tӵ đӝng mc Subject trong email có thӇ dùng mӝt
trưӡng ҭn như sau:
<INPUT TYPE="IDDEN" NAME="subject" VAUE="membership
form">
Òoҥn m này điӅn xâu kí tӵ đ gán cho thuӝc tính VAUE vào dòng chӫ đӅ -
subject trong email.
l. Nhãn
Thҿ label
Các nút đ có nh n ngҫm đӏnh, gán bҵng thuӝc tính value
Các thành phҫn còn lҥi như text fields, checkboxes, radio buttons, menus
không có nh n ngҫm đӏnh. Có thӇ hiӇn thӏ mӝt xâu kí tӵ kӅ bên thích hӧp đӇ làm
"nh n" như ta vүn làm trên.
Tuy nhiên, đ c tҧ HTrL có thành phҫn ABE đӇ gán nh n cho các thành
phҫn điӅu khiӇn khác.
C p thҿ <LABEL>... </LABEL> dùng đӇ đӏnh nghĩa thành phҫn
ABE.
Thuӝc tính FOR cӫa thҿ label
<ABE for="Id">
Thuӝc tính này nhҵm gán nh n cho thành phҫn điӅu khiӇn trӓ bi Id. Id là tên
đӏnh danh cӫa thành phҫn điӅu khiӇn.
NӃu không có thuӝc tính for thì ngҫm đӏnh là gán cho thành phҫn điӅu khiӇn
chӭa trong c p thҿ ABE đang xét.
Có thӇ nhiӅu hơn mӝt ABE cho cùng mӝt thành phҫn điӅu khiӇn
Ví d:
<¼ORM action="..." method="post">

<TABE>
<TR>
<TD><ABE for="fname">¼irst Name</ABE>
<TD><INPUT type="text" name="firstname" id="fname">
<TR>
<TD><ABE for="lname">ast Name</ABE>
<TD><INPUT type="text" name="lastname" id="lname">
</TABE>
69
</¼ORM>
Gҳn nh n không dùng thuӝc tính FOR
ÒӇ gҳn nh n cho mӝt thành phҫn điӅu khiӇn mà không dùng thuӝc tính ¼OR,
thành phҫn điӅu khiҿn phҧi nҵm bên trong thành phҫn ABE. Lúc này, mӝt thành
phҫn ABE chӍ chӭa mӝt thành phҫn điӅu khiӇn. Các chӳ làm nh n có thӇ đ t
trưӟc hay sau thành phҫn điӅu khiӇn.
Ví d: gán nh n cho 2 thành phҫn text field.

<ABE>
¼irst Name
<INPUT type="text" name="firstname">
</ABE>
<ABE>
<INPUT type="text" name="lastname">
ast Name
</ABE>

</¼ORM>
VII.1.3. Thêm tính c̽u trúc cho FORM
a. FIELDSET và LEGEND
Thành phҫn ¼IEDSET cho phép nhóm mӝt sӕ thành phҫn điӅu khiӇn có
liên quan vӟi nhau. NSD dӉ hiӇu hơn, còn ngưӡi thiӃt kӃ trang cũng dӉ xӱ lí di
chuyӇn focus hơn.
Thành phҫn EGEND cho phép gҳn mӝt dòng chú giҧi cho mӝt ¼IEDSET
Các thuӝc tính
align = v vv v
v
Ëp top: legend đ t phía trên cӫa fieldset. Òây là giá trӏ m c đӏnh.
Ëp bottom: legend đ t phía dưӟi cӫa fieldset.

Ëp left: legend đ t phía trái.
Ëp right: legend đ t phía phҧi cӫa fieldset.
Vi d

<¼IEDSET>
70
<EGEND>Personal Information</EGEND>
ast Name: <INPUT name="personal_lastname"
type="text">
¼irst Name: <INPUT name="personalӴfirstname"
type="text">
Address: <INPUT name="personalӴaddress"
type="text">
</¼IEDSET>
<¼IEDSET>
<EGEND>Medical istory</EGEND>
<INPUT name="history_illness" type="checkbox"
value="Smallpox"> Smallpox
value="Mumps"> Mumps
value="Dizziness"> Dizziness
value="Sneezing"> Sneezing
</¼IEDSET>
<¼IEDSET>
<EGEND>Current Medication</EGEND>
Are you currently taking any medication?
<INPUT name="medication_now" type="radio"
value="Yes">Yes
<INPUT name="medication_now" type="radio"
value="No">No
 If you are currently taking medication, please
indicate it in the space below:
<TEXTAREA name="current_medication" rows=""
cols="0">
</TEXTAREA>
</¼IEDSET>
</¼ORM>
Trình duyӋt sӁ hiӇn thӏ như sau:
71
Hình VII.1. K͇t qu̫ ví dͭ
VII.2. Cascading style sheet
Style Sheets là mӝt đ c tính quan trӑng mà có thӇ đưӧc dùng trong HTrL
đӝng (Dynamic HTrL). r c dù trang Web không thұt sӵ cҫn phҧi có mӝt style
sheet, nhưng viӋc dùng nó có nhiӅu lӧi ích. Trong phҫn này, ta sӁ làm quen vӅ công
nghӋ style sheet dùng đӇ nâng cao viӋc thiӃt kӃt và phát triӇn trang Web.
VII.2.1. Inline Style
rӝt đ c tính quan trӑng cӫa Dynamic HTrL là các style đӝng. Ta có thӇ
thay đәi style cӫa nhiӅu phҫn tӱ HTrL trên trang sau khi nó đưӧc hiӇn thӏ trong
trang. Sӵ thay đәi có thӇ thӇ hiӋn bҵng cách đáp lҥi tương tác cӫa ngưӡi dùng ho c
sӵ kiӋn thay đәi trҥng thái (như sӵ kiӋn thay đәi kích thưӟc).
Có hai cách thay đәi style cӫa trang:
Thay đәi style bên trong
ViӃt các scripts đӇ thay đәi style
Sӱ dng các inline style ta có thӇ viӃt các style đӝng mà không phҧi viӃt
thêm script vào trang.
rӝt ³inline style´ là mӝt style mà đưӧc gán vào mӝt phҫn tӱ đ c biӋt. Style
không hӛ trӧ cho tҩt cҧ các phҫn tӱ cӫa mӝt kiӇu ho c mӝt lӟp nào đó. rӝt inline
style đưӧc đӏnh nghĩa dùng thuӝc tính STYE cho tag cӫa các phҫn tӱ. Ví d, nӃu ta
72
muӕn gán màu cӫa < > (Heading 1) thành màu đӓ, ta có thӇ gán thuӝc tính STYE
cӫa thҿ .
< STYE=ćolor:red´>
NӃu ta muӕn dùng script đӇ sӱa mӝt inline style bҩt kǤ lúc nào, khi đó ta
phҧi dùng đӕi tưӧng style (Style Object). Style Object hӛ trӧ mӑi thuӝc tính mà
CSS hӛ trӧ cho các style. ÒӇ dùng thuӝc tính trong scrip:
Loҥi bӓ gҥch nӕi tӯ tên thuӝc tính style CSS
Thay đәi chӳ đҫu tiên cӫa tӯ sau gҥch nӕi thành chӳ viӃt hoa
Ví d, thuӝc tính CSS font-weight thành fontWeight trong DHTrL. Ho c
text-align thành textAlign.
Ta h y xem mӝt ví d đӇ xóa mӑi thӭ. Ta sӁ dùng inline style đӇ gán các
thuӝc tính cӫa nhân tӕ . Xem đoҥn code dưӟi đây trong Internet Explorer:
<TM>
<EAD>
<TITE>Setting Properties</TITE>
</EAD>
<BODY>
 This paragraph has an inline style
applied to it
 
 This paragraph is displayed in the default style.
 
Can you see the differencein this line
</BODY>
<TM>
73
Hình VII.2. S͵ dung Inline Style
VII.2.2. Giͳi thi͟u Style Sheet
Style sheet là nơi mà ta quҧn lý và điӅu khiӇn các style. Style sheet mô tҧ
diӋn mҥo và viӋc biӇu diӉn cӫa mӝt tài liӋu HTrL như nó sӁ đưӧc đưa ra trên màn
hình, ho c in ra ngoài. Trong thӵc tӃ, ta có thӇ nghĩ vӅ nó như mӝt khuôn mүu đӇ
căn cӭ vào các tài liӋu HTrL cӫa ta. Ò c biӋt ta cũng có thӇ đӏnh rõ vӏ trí và sӵ
xuҩt hiӋn cӫa các phҫn tӱ trên mӝt trang và tҥo các hiӋu ӭng đ c biӋt. Ví d ta có
thӇ tҥo mӝt style sheet đӏnh nghĩa cho thҿ < > là chӳ béo và nghiêng và màu xanh.
Ho c thҿ phҫn tӱ đưӧc đưa ra vӟi màu đӓ vӟi font Arial.
Ta có thӇ đӏnh nghĩa thông tin style mà ta muӕn trong mӝt vӏ trí ± style sheet.
Khi đó style sheet có thӇ đưӧc liên kӃt đӇ tҩt cҧ các trang trong mӝt Web site đӇ tҥo
mӝt diӋn mҥo thích hӧp, đӗng nhҩt qua site bên trong. Ta có thӇ đӏnh nghĩa nhiӅu
style sheet và liên kӃt chúng thành mӝt tұp như nhau cӫa các trang Web đӇ mӅm
dҿo hơn nhiӅu trong khi tҥo các trang Web.
rӝt trang Web có thӇ không có style sheet, nӃu không có style sheet đưӧc
xác đӏnh, khi đó trình duyӋt sӁ sӱ dng cách hiӇn thӏ theo quy ưӟc ngҫm đӏnh cӫa
nó. Ví d, mӝt thҿ < > luôn đưӧc hiӇn thӏ cùng mӝt đӏnh dҥng, các đoҥn và các lӅ
cũng như vұy. Dù sao viӋc dùng style sheet ta có thӇ xác đӏnh cách mà thҿ < >
đưӧc hiӇn thӏ trong trình duyӋt.
VӅ m t lý thuyӃt, ta có thӇ dùng bҩt kǤ công nghӋ style sheet nào vӟi HTrL.
Dù sao thӵc tӃ thì chӍ công nghӋ Cascading Style Sheet (CSS) đưӧc các trình duyӋt
74
hӛ trӧ tӕt. CSS là mӝt chuҭn đưӧc phát triӇn bi World Wide Web Consortium
(thưӡng gӑi là ³W3C´) dùng trong các trình duyӋt Web.
VII.2.3. Javascript Style Sheet
Netscape hӛ trӧ các cascading style sheet. Nó cũng hӧ trӧ style sheet mà đưӧc
viӃt trông giӕng JavaScript và dùng mô hình đӕi tưӧng tài liӋu ± Document Object
rodel (DOr). Khi ra đӏnh nghĩa mӝt style sheet ta có thӇ khai báo kiӇu như:
³text/CSS´ - - Trong trưӡng hӧp này nó tìm cú pháp CSS.
³text/JavaScript´ ± Trong trưӡng hӧp này nó tìm cú pháp JavaScript style sheet.
Khi dùng cú pháp JavaScript trong phҫn tӱ <STYE>, ta phҧi xác đӏnh thuӝc
tính các thҿ cӫa đӕi tưӧng tài liӋu.
Trong mô hình đӕi tưӧng tài liӋu, các phҫn tӱ HTrL đưӧc đӕi xӱ như các
đӕi tưӧng. rӝt đӕi tưӧng có các thuӝc tính và có thӇ đưӧc truy nhұp đӇ đӏnh nghĩa
diӋn mҥo và style cӫa phҫn tӱ. rӝt thuӝc tính trҧ vӅ có thӇ hoҥt đӝng như mӝt đӕi
tưӧng vӟi mӝt tұp các thuӝc tính. Ví d, mӝt trang Web đưӧc đӕi xӱ như mӝt đӕi
tưӧng tài liӋu. Òӕi tưӧng tài liӋu có mӝt thuӝc tính các thҿ. Thuӝc tính các thҿ có
mӝt đӕi tưӧng H2. Òӕi tưӧng H2 có mӝt thuӝc tính gӑi là color mà có thӇ đưӧc truy
nhұp và thay đәi khi đưӧc yêu cҫu.
Document.tags.2.color = ³limegreen´
Ví d:
<TM>
<EAD>
<STYE TYE = ³text/javascript´>
tags.P.fontSize = ³2pt´;
tags.P.margineft = ³ pt´;
tags.2.color = ³hotpink´;
</STYE>
</EAD>
<BODY>
<2>This is an 2 element with a style applied</2>
 
This is a paragraph element
</BODY>
</TM>
75
Tҩt cҧ các phҫn tӱ khác đӅu thӯa kӃ tӯ phҫn tӱ <BODY>. NӃu ta muӕn cung
cҩp mӝt style m c đӏnh cho tҩt cҧ các phҫn tӱ trong mӝt tài liӋu, ta có thӇ đ t style
yêu cҫu trong phҫn tӱ <BODY>. Òoҥn m sau chҥy trên trình duyӋt netscape:
Ví d:
<TM>
<EAD>
<STYE TYPE = ³text/javascript´>
tags.body.color=´red´;
</STYE>
</EAD>
<BODY>
<2>This is an 2 element</2>
 
This is a paragraph element
</BODY>
</TM>
Hình VII.3. H͟ trͫ m͡t style bình thưͥng

Ví d:
<TM>
<EAD>
<STYE TYPE = ³text/css´>
BODY {color:limegreen}
</STYE>
</EAD>
<BODY>
76
 
This is a paragraph element
</TM>
NӃu ta phҧi đ t nhiӅu thuӝc tính cho mӝt phҫn tӱ, ta có thӇ dùng cú pháp đӇ
rút ngҳn lҥi m :
<TM>
<EAD>
<STYE TYPE = ³text/javascript´>
with (tags.P) {
color=´hotpink´;
fontStyle=ítalic´;
font¼amily=´helvetica´;
fontSize=´20pt´;
}
</STYE>
</EAD>
<BODY>
This is a paragraph element
</BODY>
</TM>
VII.2.4. Thuͅt ng· Style Sheet

rӝt cascading style sheet đӏnh nghĩa các style mà có thӇ đưӧc cung cҩp cho
các trang ho c các phҫn tӱ trang.
Luұt style - - rӝt cascading style sheet là mӝt tұp các luұt. rӝt luұt đӏnh
nghĩa đӏnh dҥng cӫa tài liӋu. Ví d, ta có thӇ tҥo mӝt luұt style đӇ quy đӏnh tҩt cҧ
các <2> xuҩt hiӋn vӟi màu xanh.
Style Sheet - - là mӝt danh sách các luұt. Nó có thӇ đưӧc nhúng vào trong tài
liӋu HTrL. Trong trưӡng hӧp đó nó đưӧc gӑi là mӝt style sheet nhúng. rӝt style
sheet cũng có thӇ đưӧc tҥo như mӝt file bên ngoài và liên kӃt vӟi tài liӋu HTrL.
Các luұt style có thӇ đưӧc cung cҩp đӇ lӵa chӑn các phҫn cӫa mӝt trang Web. Ví d,
ta có thӇ quy đӏnh mӝt đoҥn văn bҧn xuҩt hiӋn dҥng chӳ đұm và nghiêng. ViӋc này
đưӧc gӑi là khai báo bên trong style (inline style declaration) nhӡ đó các style đưӧc
cung cҩp đӇ chia các phҫn tӱ HTrL trên mӝt trang Web.
77
Rác luұt - - rӝt style sheet có thӇ gӗm mӝt ho c nhiӅu luұt. Phҫn đҫu cӫa
luұt đưӧc gӑi là Selector. rӛi selector có cá thuӝc tính và các giá trӏ kӃt hӧp vӟi nó.
Ví d:
A RuleSelector{Declarationsproperty: value; property:
value; « }
Phҫn cӫa luұt kèm theo bên trong các ngo c nhӑn đưӧc gӑi là Khai báo
(Declaration). rӝt khai báo có hai phҫn, phҫn trưӟc dҩu hai chҩm là thuӝc tính
(Property) và phҫn sau dҩu hai chҩm là giá trӏ (Value) cӫa thuӝc tính đó.
Các khai báo phân chia ra bi dҩu chҩm phҭy (;). Ta không cҫn đ t mӝt dҩu
phҭy chҩm sau khai báo cuӕi cùng.
Ví d: {color:blue}
H1 là Selector, color:blue là khai báo.
Bên trong khai báo:
{Thuӛc tính:Giá trӍ}
Color là thuӝc tính, blue là giá trӏ.
Ta có thӇ đ t mӛi luұt tách rӡi bên trong các thҿ STYE. Trong trưӡng hӧp
đó các header cӫa ta sӁ đưӧc liӋt kê.
Ví d:
<TM>
<EAD>
{ color:limegreen }
{ font-family: Arial }
{ color: limegreen }
2{ font-family:Arial }
</STYE>
</EAD>
< >This is the element</ >
<2>This is the 2 element</2>
<3>This is the 3 element with its default style as
displayed in the browser</3>
</TM>
78
Ta cũng có thӇ nhóm các luұt. rӛi khai báo đưӧc phân chia bi mӝt dҩu
chҩm phҭy.
Ví d:
<TM>
<EAD>
, 2{ color: limegreen;font-family: Arial;}
</STYE>
</EAD>
< >This is the element</ >
<2>This is the 2 element</2>
<3>This is the 3 element with its default style as
displayed in the browser</3>
</TM>
Hình VII.4. Lu̵t nhóm
Rác Selector
Selector có thӇ đưӧc đӏnh nghĩa như, ³mӝt xâu mà quy đӏnh các luұt nào hӛ
trӧ cho các phҫn tӱ nào.
Có hai kiӇu cơ bҧn cӫa các selector
-p Rác selector đơn giҧn (Simple selectors)
-p HTrL Selectors
-p Class selectors
79
-p ID Selectors
-p Rác selector ngӳ cҧnh (Rontextual selectors)
a. Rác selector đơn giҧn (Simple selectors)
Sӱ dng dӉ nhҩt. Nó mô tҧ mӝt phҫn tӱ không kӇ vӏ trí cӫa nó trong cҩu trúc
tài liӋu. Quy đӏnh H1 là mӝt selector đơn giҧn.
Ví d: {color:blue}
HTML Selector
Seletor này sӱ dng các tên cӫa các phҫn tӱ HTrL. ChӍ khác là ta loҥi bӓ
các móc nhӑn. Như vұy, thҿ HTrL tr thành P. Trong ví d dưӟi đây, trong
khi đӏnh nghĩa style, phҫn tӱ P không có các móc nhӑn. ÒiӅu này bi vì, phҫn tӱ
 HTrL đưӧc đӕi xӱ như mӝt selector.
Ví d:
<TM>
<EAD>
<STYE TYPE=´text/css´>
P{font-style:italic; font-weight:bold;color:limegreen}
</STYE>
</EAD>
Ӣ đây các nӝi dung cӫa đưӧc xác đӏnh. Phҫn tӱ đưӧc đӕi xӱ như
mӝt phҫn tӱ HTrL.
This selectors use the names of TM elements. The
only fifference is that you remove the brackets.
</BODY>
</TM>
Hình VII.5. S͵ dͭng m͡t HTML selector
80
Rlass Selector
Các selector này dùng thuӝc tính CASS cӫa các phҫn tӱ HTrL. rӑi phҫn
tӱ, mà thҩy đưӧc, có mӝt thuӝc tính CASS mà đưӧc dùng đӇ gán mӝt quy đӏnh.
Thay vì ta có thӇ gán mӝt quy đӏnh lӟp cho nhiӅu phҫn tӱ cӫa mӝt kiӇu đơn khi ta
muӕn hiӇn thӏ nhiӅu màu khác nhau. Trong trưӡng hӧp đó ta sӁ dùng mӝt quy đӏnh
lӟp cho <2>.
CASS Selector đưӧc bҳt đҫu vӟi mӝt dҩu chҩm (.) gӑi là ký tӵ cӡ (flag),
theo sau bi µtên lӟp¶ cӫa selector. SӁ tӕt hơn đӇ chӑn các tên lӟp theo mc đích
hơn là mӝt tên mà mô tҧ màu ho c style cӫa hӑ. Ví d, ta có thӇ muӕn đoҥn A xuҩt
hiӋn dҥng chӳ nghiêng, các đoҥn khác xuҩt hiӋn vӟi style khác, trong trưӡng hӧp
đó đoҥn A có thӇ có mӝt quy đӏnh lӟp.slant.
Ví d:
.water { color: blue }
.danger { color: red }
</STYE>
test water
test danger
no style
 
italic
Hình VII.6. S͵ dͭng CLASS selector
81
Ví d:
<TM>
<EAD>
<STYE TYPE=´text/javascript´>
classes.water.all.color = ³blue´
classes.danger.all.color = ³red´
</STYE>
</EAD>
test water
test danger
no style
 
italic
</BODY>
</TM>
Khi dùng cú pháp JavaScript, ta không thӇ dùng gҥch nӕi bên trong các tên
lӟp. Bi vì JavaScript đӑc gҥch nӕi như mӝt dҩu trӯ (-) mà là mӝt toán tӱ
JavaScript. Các tên lӟp không thӇ gӗm bҩt kǤ toán tӱ JavaScript nào.
Khi đӏnh nghĩa mӝt style class:
Ta có thӇ xác đӏnh các phҫn tӱ HTrL nào có thӇ dùng style này
Ta có thӇ dùng tӯ khóa tҩt cҧ đӇ cho tҩt cҧ các phҫn tӱ có thӇ dùng nó.
Ví d:
<TM>
<EAD>
all.hotpink {color:hotpink;}
P.BUE {color: blue; font-weight:bold;}
.red {color:red; font-weight:bold;}
</STYE>
</EAD>
<BODY bgColor = lavender>
This paragraph is blue.
This paragraph does not use the class BUE.
< CASS=red >This is an element that tried to use
the red class</>
This paragraph is hotpink.
< CASS=hotpink>This is an element that has been
allowed to use hotpink style.</>
</BODY>
82
</TM>
Hình VII.7. Xác đ͓nh các ph̯n t͵

Ví d:
<TM>
<EAD>
classes.OTPINK.all.color=´hotpink´;
classes.BUE.P.color = ³blue´;
classes.BUE.P.fontWeight = ³bold´;
classes.red ..color = ³red´;
classes.red ..fontWeight = ³bold´;
</STYE>
</EAD>
<BODY bgColor = lavender>
This paragraph is blue.
This paragraph does not use the class BUE.
< CASS=hotpink>This an element that tried to use
the red class</>
This paragraph is hot pink.
< CASS=hotpink>This is an element that has been
allowed to use hotpink style.</>
</BODY>
83
</TM>
ID Selector
rӝt ID Selector dùng thuӝc tính ID cӫa mӝt phҫn tӱ HTrL. rӝt ID selector
đưӧc dùng đӇ cung cҩp mӝt style cho mӝt phҫn tӱ c thӇ trên trang Web. Ví d, ta
có thӇ dùng mӝt ID selector đӇ cung cҩp cho mӝt tiêu đӅ <2>. Không có nghĩa là
cùng mӝt style sӁ đưӧc cung cҩp cho sӵ kiӋn khác cӫa mӝt phҫn tӱ <2> trên cùng
mӝt trang, trӯ khi chӍ rõ. Nó tương tӵ như viӋc dùng mӝt inline style do đó mӝt
style đưӧc cung cҩp cho mӝt phҫn tӱ xác đӏnh. rӝt ID selector đưӧc bҳt đҫu bi
mӝt dҩu thăng (#). Khi dùng cú pháp JavaScript, ta phҧi dùng thuӝc tính ID.
Ví d:
<TM>
<EAD>
<TITE> ID Selectors</TITE>
</EAD>
<BODY>
control {color: red}
</STYE>
<2 id=ćontrol´>¼ire is this colour</2>
 
This paragraph has no style applied
</BODY>
</TM>
Hình VII.8. S͵ dͭng ID selector
84
Ví d:
<TM>
<EAD>
<TITE>Combining ID and Class Selectors</TITE>
</EAD>
<BODY>
.forest {color: green }
.danger {color: red }
control {color: blue }
</STYE>
green things
fire hazards

more green things
 
more fire hazards

things that burn
things that don¶t burn

water
</BODY>
</TM>
85
Hình VII.9. K͇t hͫp ID và Class selector
Ví d:
<TM>
<EAD>
<TITE>Combining ID and Class Selectors</TITE>
</EAD>
<BODY>
With (classes.forest.all) {
Color = ³green´;
}
With (classes.danger.all){
Color = ³red´;
}
idss.control.color = ³blue´;
</STYE>
green things
fire hazards

more green things
 
more fire hazards

86
things that burn
things that don¶t burn

water
</BODY>
</TM>
b. Rác selector ngӳ cҧnh (Rontextual Selectors)
rӝt contextual seclector đӅ cұp đӃn ngӳ cҧnh cӫa các phҫn tӱ. ÒӇ làm mӑi
thӭ sáng sӫa hơn, đôi khi ta có hai phҫn tӱ vӟi cùng mӝt giá trӏ. Phҫn tӱ chính ho c
phҫn tӱ cha có mӝt phҫn tӱ con bên trong nó. Trong trưӡng hӧp đó, đӇ thay đәi
style cӫa phҫn tӱ con ta cҫn dùng mӝt contextual selector.
ÒiӅu này dӵa trên khái niӋm kӃ thӯa, nơi mà phҫn tӱ con kӃ thӯa style đưӧc
gán cho phҫn tӱ cha.
rӝt ví d thông thưӡng là phҫn tӱ <BODY>. Khi ta thêm mӝt phҫn tӱ vào
mӛi phҫn tӱ <BODY> chӭa bên trong nhӳng kӃ thӯa cӫa <BODY>.
«««
P là cha và B là con.
Bây giӡ thì xem nó đưӧc điӅu khiӇn ra sao? Sau khi ta không muӕn tҩt cҧ các
phҫn tӱ trên trang Web xuҩt hiӋn cùng mӝt style. Như vұy, ta phҧi ghi đè sӵ kӃ
thӯa. Trong trưӡng hӧp đó ta sӁ phҧi thay đәi style cӫa phҫn tӱ con. Xem đoҥn
code dưӟi đây:
Ví d:
<TM>
<EAD>
<TITE>Contextual selectors</TITE>
</EAD>
BODY { color:blue;
Background:lavender;
¼ont-family:Arial;
}
U {color:red}
</STYE>
Selector UL trong style sheet xác đӏnh rҵng danh sách không đánh sӕ màu đӓ,
do đó tҩt cҧ các phҫn tӱ LI sӁ là màu đӓ trӯ khi nó đưӧc ghi đè sӵ kӃ thӯa này.
87

 mangoes
 oranges
 apples

Selector U Selector trong style sheet xác đӏnh rҵng các chӍ mc danh sách
sӁ là màu đӓ. Chúng thӯa kӃ font Arial tӯ khai báo BODY, màu đӓ tӯ khai báo U.
NӃu ta xác đӏnh mӝt font family trong khai báo U, nó sӁ ghi đè khai báo selector
BODY. Không có selector O trong style sheet, do đó danh mc O kӃ thӯa các
thuӝc tính cӫa nó tӯ selector BODY.
<O>
 managoes
 oranges
 apples
</O>
</BODY>
</TM>
Hình VII.10. Contextual Selectors

Các phҫn tӱ không đưӧc kӃ thӯa trong style sheet như các selector sӁ kӃ thӯa
các thuӝc tính cӫa phҫn tӱ cha nó. Trong ví d dưӟi đây, các phҫn tӱ B và I đang kӃ
thӯa các thuӝc tính cӫa selector P.
88
Ví d:
<TM>
<EAD>
<TITE>Contextual Selectors</TITE>
</EAD>
BODY { color:blue;
background:lavender;
font-family:Arial;
}
P {color:hotpink}
</STYE>
<BODY>

I am having fun 
This is fun too 
ÒӇ sӵ trҧ vӅ cӫa các thuӝc tính cӫa selector P, đóng nó lҥi


I am having fun
 
This is fun too
</BODY>
</TM>
Hình VII.11. Contextual Selectors
89
Ví d:
<TM>
With (tags.BODY){
color=´blue´;
backgroundColor=´lavender´;
font¼amily=Árial´;
}
tags.P.color=´hotpink´;
</STYE>
<BODY>

I am having fun 
This is fun too 

I am having fun
 
This is fun too
</BODY>
</TM>
Thay đәi các luұt

Ta phҧi tìm hiӇu đӇ chӍnh sӱa style cӫa mӝt phҫn tӱ c thӇ. Có thӇ các kӃ thӯa
khi ta muӕn làm các thӭ trên phҥm vi toàn cc, cho tҩt cҧ các trang trong web site.
Ta có thӇ muӕn chӍnh sӱa mӝt style đӏnh nghĩa bi mӝt style sheet như mӝt lӟp
ho c style toàn cc. Khi ta làm điӅu này, sӵ sӱa đәi có mӝt hiӋu ӭng gӧn sóng. Òó
là, style cӫa tҩt cҧ các phҫn tӱ trên trang mà đưa ra style sheet đ c biӋt đưӧc thay
đәi.
Ví d, ta có mӝt đӏnh nghĩa style sheet mà xác đӏnh hai style:
rӝt style toàn cc mà cung cҩp toàn bӝ phҫn tӱ <2> (green, arial font,
normal size)
rӝt lӟp style chung gӑi là cҧnh báo (red, bold, italic) mà sӁ cung cҩp bҩt kǤ
mӝt phҫn tӱ nào mà sӱ dng lӟp đó.
Hai ví d sau đây miêu tҧ viӋc dùng style sheet gӑi là þv þþ mà
đưӧc liên kӃt vӟi .htm đҫu tiên và sau đó là 2.htm
90
Ví d:
sheet .css:
2 {color:blue; font-style:italic;}
.warning {color:red; font-weight:bold; font-
style:italic;}
Copy đoҥn code này và ghi vӟi tên ³þv þþ´

Sau đó trong file f1.htm ta sӱ dng nó như sau:
f .htm
<TM>
<EAD>
<TITE>Changing the Rules</TITE>
<INK RE=stylesheet RE¼=´sheet .css´
TYPE=´text/css´>
</EAD>
<2>Changing the rules is fun</2>
 
Changing the rules may not be
such fun
<2>The 2 element again
</TM>
Hình VII.12. S͵ dͭng m͡t style sheet thông thưͥng
91
Trong file f2.htm ta cũng sӱ dng:
f2.htm
<TM>
<EAD>
<TITE>Changing the Rules</TITE>
<INK RE=stylesheet RE¼=´sheet .css´
TYPE=´text/css´>
</EAD>
<2>This document uses the sheet style
sheet<2>
 
Selecting this option could
delete all your files
<2>The 2 element again
</TM>
VII.2.5. Các chú thích trong Style Sheet
Các chú thích (comments) là mӝt đ c tính mà hҫu hӃt các ngôn ngӳ phát
triӇn đӅu hӛ trӧ. Ta cũng có thӇ thêm các chú thích vào mӝt style sheet đӇ giúp lưu
giӳ vӃt cӫa các style mà đưӧc hӛ trӧ thông qua trang. Các chú thích đưӧc bao
quanh bi các dҩu /*. Không đưӧc đ t lӗng vào nhau.
Vӟi cascading style sheet, cú pháp là:
{color:blue;} /Các phҩn tӯ màu xanh/
tags. .color=´blue´; /Các phҩn tӯ màu xanh/
Vӟi JavaScript style sheet, cú pháp là:
tags. .color=´blue´; //Các phҩn tӯ màu xanh
VII.2.6. Lͻi ích cͿa các Style Sheet
NӃu ta muӕn sӱ dng điӅu khiӇn lӟn hơn vӟi các trang Web ta nên sӱ dng
style. Ta có thӇ sӱ dng style sheet cho:
a. Ghi đè các ngҫm đӏnh trình duyӋt
rӛi trình duyӋt có cách thӇ hiӋn các trang Web riêng cӫa nó. Ngày nay, các
chuyên viên phát triӇn không có quyӅn vӟi trang đưӧc thӇ hiӋn trong mӝt trình
duyӋt. Ta không biӃt đưӧc trình duyӋt nào trên toàn cҫu đưӧc sӱ dng. Vӟi các
style sheet ta có thӇ ghi đè các m c đӏnh truyӅn thӕng cӫa trình duyӋt và gán nó
thành cӫa riêng ta. Ví d, ta có thӇ xác đӏnh style trong phҫn tӱ < > như sau:
92
< ><¼ONT SIZE=3 COOR=AUA>
Overriding the browser
</¼ONT></ >
b. Bӕ trí trang
Các style sheet có thӇ đưӧc dùng đӇ hiӇn thӏ font, thay đәi màu sҳc,« mà
không thay đәi cҩu trúc cӫa trang web. Nghĩa là mӝt ngưӡi thiӃt kӃ có thӇ tách rӡi
các yêu cҫu thiӃt kӃ trӵc quan tӯ cҩu trúc logic cӫa trang Web và đánh đӏa chӍ khác
nhau.
ViӋc dùng các đӝ đo tương đӕi trong style sheet cӫa ta, ta có thӇ biӇu diӉn tài
liӋu đӇ trông đҽp hơn trên màn hình tҥi bҩt kǤ đӝ phân giҧi nào.
c. Rác Style Sheet có thӇ đưӧc tái sӱ dөng
Sau khi ta đӏnh nghĩa thông tin style, ta có thӇ nhúng style sheet vào trong tài
liӋu HTrL. Ta cũng có thӇ liên kӃt toàn bӝ các trang trên web site tӟi style sheet.
ÒiӅu này đҧm bҧo rҵng các trang web cӫa ta có mӝt diӋn mҥo đӗng bӝ khi chúng
đưӧc hiӇn thӏ. Như vұy ta có thӇ có mӝt nӅn thông thưӡng, logo công ty và mӝt sӕ
thông tin chuҭn trong mӝt style sheet. ÒiӅu này sӁ đҧm bҧo rҵng mӝt cái nhìn thông
thưӡng và cҧm giác trên Web site. H y tưng tưӧng nӃu có hàng trăm trang và ta
phҧi đӏnh nghĩa style cӫa mӛi trang riêng biӋt.
d. Tҥo mӝt lҫn
Ta có thӇ tҥo mӝt style sheet và liên kӃt nhiӅu tài liӋu tӟi nó. Tҩt cҧ các tài
liӋu sӁ có mӝt diӋn mҥo. Dù sao quan trӑng nhҩt là khi ta tҥo mӝt thay đәi tӟi style
sheet tҩt cҧ các tài liӋu liên kӃt tӟi style sheet sӁ mang lҥi sӵ thay đәi.
VII.2.7. K͗t hͻp Style Sheet vͳi HTML
Có nhiӅu cách đӇ kӃt hӧp style sheet vӟi HTrL
-pPhҫn tӱ STYE
-pThuӝc tính Style
-pPhҫn tӱ liên kӃt
Phҫn tӱ STYLE (STYLE element)
Phҫn tӱ STYE đưӧc chèn vào trong phҫn tӱ <EAD> cӫa mӝt tài liӋu vӟi
toàn bӝ luұt đ t giӳa các thҿ m và đóng. Khi các trang đưӧc hiӇn thӏ, chӍ tài liӋu
mà có STYE đưӧc nhúng vào mӟi bӏ tác đӝng. Thҿ <STYE> có mӝt tham sӕ --
TYPE. Tham sӕ này xác đӏnh kiӇu Internet redia như ³text/css´.
93
Ví d:
<TM>
{color:maroon;}
P {color:hotpink;
¼ont-family:Arial;
}
</STYE>
<BODY bgcolor=´lavender´>
< >I am having fun</ >
This is al about having fun with style
sheets
</BODY>
</TM>
Hình VII.13. S͵ dͭng ph̯n t͵ STYLE

<TM>
<EAD>
tags. .color=´maroon´;
with (tags.P){
color=´hotpink´;
font¼amily=Árial´;
}
</STYE>
</EAD>
<BODY bgcolor=´lavender´>
< >I am having fun</ >
This is all about having fun with style
sheets
94
</BODY>
</TM>
Hình VII.14. S͵ dͭng ph̯n t͵ STYLE
Thuӝc tính STYLE

Thuӝc tính STYE đưӧc dùng đӇ cung cҩp style sheet cho các phҫn tӱ riêng lҿ.
rӝt Style Sheet có thӇ nhӓ bҵng mӝt luұt. Sӱ dng thuӝc tính Style ta có thӇ bӓ
qua phҫn tӱ Style và đ t các khai báo trӵc tiӃp vào trong các thҿ bҳt đҫu riêng lҿ.
<2 style=ćolor:green;
font-family: Arial´>
</2>
Thông thưӡng, ta có thӇ chӍ dùng thuӝc tính này nӃu ta đang thay đәi style cӫa
mӝt phҫn tӱ đ c biӋt. NӃu ta có ý đӏnh cung cҩp cùng mӝt style trên toàn bӝ tài liӋu,
khi đó đây không thұt sӵ là cách hay đӇ đҥt đưӧc điӅu này.
Ví d:
<TM>

This line will be blue and italicized.

This line will not be blue or in italics.
</TM>
95
Hình VII.15. S͵ dͭng thu͡c tính STYLE
Phҫn tӱ liên kӃt (Link Element)
NӃu ta muӕn dùng phҫn tӱ liên kӃt, khi đó Style Sheet phҧi đưӧc tách khӓi tài
liӋu. Khi đó đӏa chӍ Web vӟi style sheet có thӇ đưӧc thêm vào.
<INK RE=stylesheet
RE¼=´stylesmine.css´
Type=´text/css´
>
Phҧi có cҧ thuӝc tính ³rel=stylesheet´ ho c trình duyӋt sӁ không tҧi
style sheet.
Ví d:
Sheet .css
2 {color.blue; font-style:italic;}
P {color:yellow;}
¼ile.htm
<TM>
<EAD>
<TITE>inking external style sheets</STYE>
<INK RE=STYESEET TYPE=´text/css´
RE¼=´sheet .css´>
</EAD>
<BODY>
 
96
This is a paragraph
</BODY>
</TM>
Sheet .css
tags.2.color=´blue´;
tags.2.fontStyle=Ítalic´;
tags.2.color=ýellow´;
¼ile.htm
<TM>
<EAD>
<TITE>A Good Title</TITE>
<INK RE=STYESEET TYPE=´text/javascript´
RE¼=´sheet .css´>
</EAD>
<BODY>
 
This is a paragraph
</BODY>
</TM>
VII.2.8. Th΁ tΉ ưu tiên cͿa các style (Cascading)

Khi ta đang dùng nhiӅu kӻ thuұt đӇ cung cҩp các style (liên kӃt và nhúng)
vào trang Web, có mӝt cách đӇ trình duyӋt quyӃt đӏnh chӑn style nào. Trình duyӋt
xӃp qua tҩt cҧ các luұt đưӧc xác đӏnh và chӑn mӝt luұt quan trӑng nhҩt. Style sheet
cc bӝ có đӝ ưu tiên cao nhҩt. TiӃp theo là style sheet toàn cc vӟi style sheet liên
kӃt tҥi phía trên.
Ví d, nӃu mӝt dòng trên trang Web đӏnh nghĩa là màu đӓ qua mӝt style
sheet liên kӃt, tҩt cҧ các đoҥn văn sӁ là màu đӓ trӯ trên, mà sӁ là màu xanh
dương.
<TM>
<INK RE=stylesheet
RE¼=´sheet .css´
Type=´text/css´>
97

This line will be limegreen.

This line will not be limegreen.
</TM>
Hình VII.16. Cascading style
Thuӝc tính
Thuӝc tính Tên RSS
Scripting
Font properties Font font
font-size fontSize
font-style fontStyle
Text properties Text-align textAlign
Text-indent textIndent
vertical-align verticalAlign
Box properties border border
border-width borderWidth
border-bottom borderBottom
border-color borderColor
Positioning
Clip clip
properties
heiht height
Left left
Top top
z-index zIndex
98
Bài tұp
1.p Tҥo ra mӝt trang web mӟi dùng đӇ đăng nhұp có giao diӋn như hình dưӟi
(sӱ dng FORr).
2.p Tҥo mӝt file css đӇ đ t m c đӏnh kiӇu font và màu cho các phҫn giӟi thiӋu
cӫa bҥn.
99
CHƯƠNG VIII. CÔNG CӨ SOҤN THO TRӴC QUAN WE? (MICROSOFT
FRONTPAGE 2003)
VIII.1. Tҥo mӝt trang Web

VIII.1.1. B͇t đ̿u s΅ dͽng FrontPage2003
Front Pages2003 chӭa tҩt cҧ các công c mà ta cҫn đӇ tҥo, xuҩt, và quҧn lý
mӝt World Wide Web site chuyên nghiӋp, bҳt mҳt và thú vӏ.
Hình VIII.1. Giao di͏n đ͛ h͕a

Ta sӁ thҩy giao diӋn đӗ hӑa ngưӡi dùng cӫa chương trình, giao diӋn này
giӕng như mӝt bӝ xӱ lý văn bҧn vӟi mӝt vài nút, thanh công c, và menu ph.
Khi ta chҥy FrontPage lҫn đҫu tiên, chương trình tҥo mӝt trang Web mӟi đӇ
ta có thӇ bҳt đҫu làm viӋc ngay lұp tӭc. Khi làm viӋc, ta có thӇ thҩy chính xác diӋn
mҥo cӫa trang Web như thӃ nào khi mӝt ngưӡi nào đó xem trang bҵng mӝt trình
duyӋt Web.
100
NӃu ta muӕn xem Internet Explorer sӁ hiӇn thӏ trang Web như thӃ nào, ta có
thӇ nhҩn nút Preview trên thanh công c Views. Khi đó cӱa sә hiӋu chӍnh cӫa ta sӁ
đưӧc thay bҵng mӝt trình duyӋt mini. ÒӇ đóng trình duyӋt mini và quay vӅ công
viӋc cӫa ta, nhҩn nút Design trên thanh công c đó.
VIII.1.2. T̹o mͱt trang t΃ mͱt template
Bây giӡ ta đ biӃt đôi chút vӅ các thanh công c và cӱa sә hiӋu chӍnh, ta có
thӇ sҹn sàng tҥo trang Web riêng cho mình:
1.p r menu Start, sau đó tìm và chҥy FrontPage2003. FrontPage m ra, mӝt
trang trӕng sӁ đưӧc tҥo ra dành cho ta
2.p ÒӇ tҥo mӝt trang Web mӟi, chӑn menu File â New. Khung new m ra nҵm
bên phҧi cӱa sә như trong hình
Hình VIII.2. Khung New

3.p Click vào ³rore page template´ trong phҫn New page. Hӝp thoҥi Page
Template m ra, ta có thӇ liӋt kê tҩt cҧ các template ta có thӇ sӱ dng khi nҥp
trang Web mӟi.
101
4.p ÒӇ tìm hiӇu thêm vӅ mӝt template, click vào nó mӝt lҫn và đӑc phҫn
Description cӫa hӝp thoҥi. rӛi trang Web Frontpage phҧi đưӧc dӵa vào mӝt
template
5.p ÒӇ bҳt đҫu vӟi trang hoàn toàn trӕng, chӑn biӇu tưӧng Normal Page; nӃu
không, chӑn mӝt trong các biӇu tưӧng khác
6.p Click vào nút OK. Hӝp thoҥi Page Template đóng lҥi. FronPage sӁ tҥo trang
Web mӟi và m nó trong cӱa sә biên tұp. Ta có thӇ bҳt đҫu làm viӋc vӟi nó
ngay lұp tӭc.
VIII.1.3. T̹o và lưu mͱt trang mͳi
Khi ta lưu mӝt file lҫn đҫu tiên, ta có thӇ chӑn mӝt tên nào đó thích hӧp hơn
tên và tiêu đӅ hiӋn có.
ViӋc chӑn mӝt tiêu đӅ ngҳn gӑn, có tính mô tҧ là quan trӑng vì hai lý do: Nó
giúp ngưӡi ta sӱ dng trang cӫa ta và nó giúp ngưӡi khác tìm thҩy nó.
Tiêu đӅ trang đưӧc hiӇn thӏ trong thanh tiêu đӅ cӫa trình duyӋt Web. Nó cũng
đưӧc sӱ dng bi các công c tìm kiӃm. Ví d, khi ta tìm kiӃm vӅ mӝt thông tin
nào đó trên Google tҥi http://www.google.com, mӛi trang Web xuҩt hiӋn đưӧc
liӋt kê theo tiêu đӅ cӫa nó.
Ta đ t cho trang cӫa ta mӝt tên và tiêu đӅ mӟi khi ta lưu nó lҫn đҫu tiên:
1.p Click nút Save trên thanh công c Standard. Hӝp thoҥi Save As sӁ xuҩt hiӋn
(hình vӁ dưӟi)
Hình VIII.3. C͵a s͝ Save As

102
2.p Sӱ dng hӝp thoҥi này, tìm và m thư mc nӟi mà ta sӁ lưu các trang Web
mà ta tҥo.
3.p Trong hӝp text File name, đ t mӝt tên mӟi cho file, phҧi chҳc chҳn là nó có
phҫn m rӝng.htm (ho c.html)
4.p Phҫn Page Title hiӇn thӏ tiêu đӅ hiӋn hành. ÒӇ chӑn mӝt tiêu đӅ mӟi, click
vào nút Change Title. Hӝp thoҥi Set Page Title sӁ m ra.
5.p Tiêu đӅ cӫa mӝt trang nên có tính mô tҧ và xúc tích. Nhұp mӝt tiêu đӅ mӟi
trong hӝp text Page Title và click OK. Ta sӁ quay tr vӅ hӝp thoҥi Save As.
6.p Click nút Save.
Sau khi bҥn đ đ t tên và lưu mӝt trang Web, ta có thӇ lưu lҥi nó mӝt cách
nhanh chóng bҵng cách click nút Save trên thanh công c Standard. Tên file ta
chӑn trưӟc đó sӁ đưӧc sӱ dng lҥi mӝt cách tӵ đӝng.
VIII.1.4. T̹o mͱt đ͙ mͽc
Text trên mӝt trang Web có thӇ đưӧc tách biӋt vӟi các text khác bҵng cách
chuyӇn đәi nó thành mӝt tiêu đӅ chính, mӝt đӅ mc bҳt mҳt nәi bұt vӟi text xung
quanh.
Như đ giӟi thiӋu trong phҫn ³Tiêu đӅ trong HTrL´ trên, các tiêu đӅ
chính đưӧc sҳp xӃp theo kích cӥ tӯ 1 (lӟn nhҩt) đӃn 6 (nhӓ nhҩt), và chúng đưӧc sӱ
dng cho vӟi cùng mӝt mc đích như mӝt đӅ mc trong mӝt bài báo, mӝt đoҥn văn
bҧn,« nào đó. Chúng cũng có thӇ đưӧc dùng làm các tiêu đӅ con vӟi mӝt mc lӟn
hơn, làm các đoҥn trích dүn đưӧc phóng lӟn, và cho nhӳng mc đích khác nhҵm
thu hút sӵ chú ý.
ÒӇ chuyӇn đәi text thành mӝt tiêu đӅ chính, thӵc hiӋn các bưӟc sau đây:
1.p Chӑn text bҵng cách kéo chuӝt lên trên nó. Text đưӧc bұt sáng.
2.p r menu Style xuӕng trên thanh công c Formatting đӇ chӑn mӝt trong sáu
kích cӥ tiêu đӅ chính, như đưӧc chӭng minh hӑa trong hình dưӟi
103
Hình VIII.4. H͡p tho̩i Style Formatting
Text đưӧc chӑn (và bҩt kǤ text trong cùng mӝt đoҥn) sӁ tr thành mӝt tiêu đӅ
chính.
Kích cӥ hiӇn thӏ cӫa mӝt tiêu đӅ chính ph thuӝc vào trình duyӋt Web đưӧc
sӱ dng bi mӝt khách tham quan đӃn site cӫa ta và cách nó đưӧc cҩu hình như thӃ
nào. Nhưng theo luұt chung, ta có thӇ tin cұy vào mӝt hӋt thӕng phân loҥi kích cӥ
tӯ 1 đӃn 6.
Các tiêu đӅ chính có thӇ đưӧc sӱ dng theo nhiӅu cách nhҩt như thӇ chúng là
text. rӝt điӅu ngoҥi lӋ là mӝt tiêu đӅ chính phҧi chiӃm khoҧng riêng cӫa nó.
ÒӇ thҩy trӵc tiӃp đưӧc điӅu này, h y bұt sáng mӝt tӯ trong mӝt đoҥn và chuyӇn
đәi nó thành mӝt tiêu đӅ chính. rӑi thӭ trong đoҥn tr thành mӝt tiêu đӅ chính.
VIII.1.5. Chͥn font và màu
Vào thӡi điӇm này, text mà ta đ thêm vào mӝt trang Web sӁ đưӧc hiӇn thӏ bҵng
cách sӱ dng cùng mӝt màu và font m c đӏnh như trong Internet Explorer: VNI-
Times, 12 point, màu đen.
Ta có thӇ thay đәi tӯng khía cҥnh này cӫa text (và các khía cҥnh khác).
104
rӝt font có thӇ đưӧc chӑn cho tҩt cҧ các text trên mӝt trang, các đoҥn c thӇ,
thұm chí phҫn cӫa mӝt đoҥn.
Bҩt kǤ font hiӋn có trên máy tính cӫa ta có thӇ sӱ dng và sӁ trông tuyӋt vӡi
khi ta xem trang Web trên máy tính đó.
Tuy nhiên, nhӳng ngưӡi tham quan đӃn Web site cӫa ta sӁ không xem trang
trên máy tính cӫa ta. Các trang cӫa ta tҥo sӁ trông khác biӋt vӟi các trang cӫa ngưӡi
khác.
Khi ta đang tҥo các trang Web, các font mà ta chӑn có thӇ sӁ có sҹn cho càng
nhiӅu khách tham quan cӫa ta càng tӕt. NhiӅu font sӁ riêng biӋt cho mӝt hӋ điӅu
hành c thӇ - nhӳng ngưӡi dùng Windows, rac, và Linux không chia sӁ nhiӅu font.
NӃu mӝt font không có sҹn, mӝt font m c đӏnh, chҷng hҥn Arial, Helvetica,
Times Roman, ho c Verdana sӁ đưӧc sӱ dng cho font đó.
Kích cӥ cӫa font có thӇ đưӧc chӍ đӏnh làm mӝt kích cӥ point ho c mӝt tӹ lӋ
tӯ 1 (nhӓ nhҩt) đӃn 7 (lӟn nhҩt).
ÒӇ đӏnh dҥng mӝt font trên mӝt trang Web mà ta đang biên soҥn, h y thӵc
hiӋn các bưӟc sau:
1.p Chӑn đoҥn text muӕn thay đәi
2.p Trên thanh công c Formatting, sӱ dng menu Font thҧ xuӕng đӇ chӑn mӝt
font c thӇ. Text đưӧc hiӇn thӏ ngay lұp tӭc bҵng font mӟi. Ta chӍ có thӇ
chӑn mӝt font vӟi menu này (xem bưӟc 6 đӇ tìm cách xác đӏnh nhiӅu font)
3.p Trên cùng thanh công c, sӱ dng menu Size thҧ xuӕng đӇ xác đӏnh mӝt kích
cӥ font.
4.p ÒӇ chӑn mӝt màu text khác và thӵc hiӋn các thay đәi khác, chӑn lӋnh Format,
Font. Hӝp thoҥi Font sӁ hiӋn ra (xem hình vӁ dưӟi)
105
Hình VIII.5. H͡p tho̩i Font
5.p Sӱ dng menu Color thҧ xuӕng đӇ chӑn mӝt màu cho text. NӃu ta chӑn
Automatic thay vì mӝt màu, màu m c đӏnh đưӧc sӱ dng.
6.p ÒӇ xác đӏnh danh sách các font, nhұp chúng vào trong hӝp danh sách Font,
đưӧc tách biӋt bi các dҩu phҭy.
7.p ÒӇ xem chӭc năng cӫa mӝt hiӋu ӭng c thӇ, h y chӑn hӝp kiӇm cӫa nó trong
khung Effects. Khung Preview hiӇn thӏ diӋn mҥo cӫa text mүu vӟi đӏnh dҥng
đưӧc chӑn - kӇ cҧ hiӋu ӭng đưӧc chӑn.
8.p Khi ta hài lòng vӟi diӋn mҥo cӫa text, h y click nút OK.
Bi vì FrontPage cho ta thҩy dáng vҿ cӫa mӝt trang trông như thӃ nào trong
khi nó đưӧc biên soҥn, ta thҩy đưӧc ngay lұp tӭc font và style đưӧc chӑn.
NӃu ta muӕn xem mӝt dòng text đ đưӧc đӏnh dҥng như thӃ nào, h y click
vào nó. Thanh công c Formatting sӁ đưӧc cұp nhұt đӇ cho biӃt nhӳng gì mà ta đ
áp dng vào text đó.
106
VIII.2. Tә chӭc mӝt trang vӟi các liên kӃt, danh sách và bҧng
Bây giӡ ta đ quen thuӝc vӟi viӋc thêm text vào mӝt trang Web, ta sӁ sҹn
sàng thӵc hiӋn bưӟc kӃ tiӃp và tә chӭc nӝi dung cӫa trang đӇ trình bày theo nhiӅu
cách khác nhau.
Các danh sách (list) là các nhóm thông tin có liên quan đưӧc tách biӋt bҵng
các dҩu bullet, sӕ, ho c nhӳng ký hiӋu khác.
Các bҧng (table) là các hӝp chӭa text, đӗ hӑa ho c ngay cҧ các table nhӓ hơn.
Siêu liên kӃt (hyperlink) là các liên kӃt có thӇ click có thӇ đưӧc sӱ dng đӇ
tҧi mӝt trang mӟi trong mӝt trình duyӋt Web.
VIII.2.1. Thêm mͱt hyperlink vào mͱt trang Web
Các tài liӋu trên World Wide Web có thӇ đưӧc nӕi kӃt lҥi vӟi nhau bҵng các
hyperlink ± các vùng có thӇ click cӫa mӝt trang Web nhҵm làm cho mӝt trang mӟi
ho c mӝt loҥi file khác đưӧc m trong mӝt trình duyӋt Web.
Các hyperlink thưӡng đưӧc kӃt tӟi text, nhưng điӅu này không phҧi là mӝt
yêu cҫu. Ta có thӇ đ t mӝt liên kӃt trên bҩt kǤ phҫn nào cӫa mӝt trang Web: các
ҧnh, nút, applet Java, các phim QuickTime, các file âm thanh rP3.
Các text hyperlink đưӧc hiӇn thӏ theo mӝt cách nhҵm tách biӋt chúng vӟi text
khác trên mӝt trang. Cách thông thưӡng nhҩt mà các hyperlink đưӧc trình bày trong
mӝt trình duyӋt Web là bҵng cách gҥch dưӟi text đưӧc liên kӃt. Hình dưӟi minh
hӑa mӝt trang Web chӭa ba hyperlink đưӧc nhұn biӃt bҵng các đưӡng gҥch dưӟi.
107
Hình VIII.6. Ví dͭ Hyperlink trong trang Web
rӝt hyperlink chӭa mӝt URL, đây là dҥng viӃt tҳt cӫa Uniorm Resource
Locator, nhưng có mӝt cách đơn giҧn hơn nhiӅu đӇ mô tҧ chúng: mӝt URL là mӝt
đӏa chӍ dүn đӃn mӝt điӅu nào đó trên Web.
Các trình duyӋt Web thưӡng hiӇn thӏ đӏa chӍ cӫa trang mà ta đang xem trong
thanh Address cӫa trình duyӋt rӝt sӕ URL mүu bao gӗm trang chӫ Sams
Publishing tҥi http://www.sampublishing.com, công c tìm kiӃm cӫa
Google tҥi http://www.google.com /unclesam, và server Knowledge
Base FTP cӫa ricrosoft tҥi http://ftp.microsoft.com
Tҥi hyperlink cũng có thӇ đưӧc sӱ dng đӇ gӱi email mӟi - nhӳng đӏa chӍ
này bҳt đҫu bҵng mailto: và theo sau là mӝt đӏa chӍ email. Ví d như mailto:
bernie@mail.house.gov
ÒӇ tҥo mӝt hyperlink, thӵc hiӋn nhӳng bưӟc sau:
1.p Trên mӝt trang Web đang m trong cӱa sә biên soҥn, rê chuӝt lên trên phҫn
cӫa trang mà sӁ đưӧc kӃt hӧp vӟi liên kӃt. Phҫn đó cӫa trang sӁ đưӧc bұt
sáng đӇ cho thҩy nó đ đưӧc chӑn.
2.p Chӑn Insert, Hyperlink (ho c clink nút Insert Hyperlink trên thanh công c
Standard). Hӝp thoҥi Insert Hyperlink xuҩt hiӋn (hình vӁ dưӟi)
108
Hình VIII.7. H͡p tho̩i Insert Hyperlink
Các hyperlink có thӇ đưӧc kӃt hӧp vӟi các file trên máy tính cӫa ta ho c bҩt
kǤ đӏa chӍ trên World Wide Web:
-p NӃu ta liên kӃt vӟi mӝt file trên máy tính cӫa ta, h y sӱ dng hӝp thoҥi đӇ
tìm và chӑn file đó
-p NӃu ta liên kӃt tӟi mӝt đӏa chӍ Web, nhұp đӏa chӍ đó trong trưӡng text
Address (ho c dán nó tӯ Windows Clipboard, nӃu nó đ đưӧc sao chép đó
tӯ trình duyӋt Web). Sau đó clink OK.
NӃu hӝp thoҥi Insert Hyperlink đóng lҥi, ta sӁ quay tr vӅ cӱa sә biên soҥn.
NӃu Hyperlink đưӧc kӃt hӧp vӟi text, nó sӁ đưӧc gҥch dưӟi trên trang Web.
Sau khi thêm mӝt hyperlink vào mӝt trang, ta có thӇ thay đәi nó bҵng cách
click chuӝt phҧi liên kӃt. Sau đó trên menu ngӳ cҧnh vӯa xuҩt hiӋn, chӑn Hyperlink
Properties.
Hӝp thoҥi Edit Hyperlink m ra. ÒӇ loҥi bӓ hoàn toàn mӝt liên kӃt, clink
chuӝt vào Remove Link.
109
Hình VIII.8. H͡p tho̩i Edit Hyperlink
VIII.2.2. T̹o mͱt danh sách
Trong hҫu hӃt các trình duyӋt Web, các đoҥn text đưӧc tách biӋt bҵng các
dòng trҳng và đưӧc canh thҷng bên lӅ trái, nhưng không đưӧc tht vào. rӝt cách
khác đӇ tә chӭc text là biӃn đәi nó thành mӝt danh sách.
Trên mӝt trang Web, các danh sách là các nhóm mc liên quan đưӧc tách
biӋt vӟi phҫn còn lҥi cӫa trang bҵng các sӕ, bullet, ho c các ký hiӋu tương tӵ. Ta có
thӇ sӱ dng hai loҥi danh sách:
-p Các danh sách đưӧc đánh sӕ, vӟi mӛi mc có mӝt sӕ duy nhҩt đӭng trưӟc
-p Các danh sách không đưӧc đánh sӕ, vӟi mӛi mc có mӝt dҩu bullet, dҩu tròn
ho c mӝt ký tӵ khác đӭng trưӟc.
Text đӭng trưӟc là mӝt danh sách hai mc không đưӧc đánh sӕ. Ký tӵ ³.´
Tương tӵ như các dҩu bullet thưӡng đưӧc hiӇn thӏ trên trang Web.
ÒӇ chuyӇn đәi các dòng text thành mӝt danh sách, thӵc hiӋn nhӳng bưӟc sau
đây:
1.p Chӑn text sӁ đưӧc chuyӇn đәi thành danh sách.
2.p Click nút Unnumbered List ho c nút Numbered List trên thanh công c
Formatting
3.p Khi mӝt danh sách đưӧc biên soҥn, click phím Enter đӇ thêm mӝt mc mӟi.
rӝt bullet ho c sӕ xuҩt hiӋn trên mӝt dòng mӟi.
110
4.p ÒӇ thay đәi cách mӝt danh sách đưӧc trình bày, đ t con trӓ trên mӝt mc
danh sách, click chuӝt phҧi và chӑn List Properties tӯ menu tҳt vӯa xuҩt hiӋn.
hӝp thoҥi List Properties xuҩt hiӋn (hình vӁ dưӟi)
Hình VIII.9. H͡p tho̩i List Properties
Hӝp thoҥi này có thӇ đưӧc sӱ dng đӇ xác đӏnh mӝt sӕ khi đҫu khác cho
mӝt danh sách đưӧc đánh sӕ và diӋn mҥo cӫa các bullet trong mӝt danh sách không
đưӧc đánh sӕ.
Các danh sách có thӇ đưӧc đ t bên trong các danh sách khác. Hình dưӟi
minh hӑa mӝt vài danh sách đưӧc sҳp xӃp lӗng nhau.
111
Hình VIII.10. Ví dͭ v͉ danh sách
Như đưӧc minh hӑa trên, các bullet hiӇn thӏ kӃ bên các mc trong mӝt
danh sách không đưӧc đánh sӕ cung cҩp mӝt gӧi ý vӅ danh sách mà chúng thuӝc vӅ
danh sách đó. NӃu mӝt danh sách không đưӧc đánh sӕ đưӧc đ t bên trong mӝt danh
sách khác thì hai danh sách có các kiӇu bullet khác nhau.
ÒӇ đ t mӝt mc danh sách bên trong mӝt danh sách khác, bұt sáng mc và
click nút Increase Ident (trên thanh công c) hai lҫn.
ÒӇ đҭy mӝt mc ra khӓi mӝt danh sách khác, bұt sáng nó và nhҩp nút
Decrease Indent hai lҫn.
Ta có thӇ đ t mӝt danh sách vào sâu bên trong mӝt danh sách khác bao nhiêu
cҩp tùy ý.
VIII.2.3. Tͭ ch΁c mͱt trang vͳi các b̻ng
rӝt trong nhӳng điӅu làm bӕi rӕi nhӳng nhà thiӃt kӃ trang Web lҫn đҫu tiên
là trҥng thái hay thay đәi cӫa mӝt trang Web. Text, đӗ hӑa và nhӳng phҫn khác hay
thay đәi cӫa mӝt trang Web di chuyӇn ph thuӝc vào cách chúng đưӧc trình bày.
Cùng mӝt trang có thӇ trông khác nhau đáng kӇ trong hai trình duyӋt khác nhau
trên các máy tính khác nhau. Thұm chí nó có thӇ thay đәi diӋn mҥo trên mӝt máy
tính nӃu cӱa sә trình duyӋt đưӧc đӏnh lҥi kích cӥ.
112
Nhӳng ngưӡi thiӃt kӃ Web có thӇ kiӇm soát đưӧc diӋn mҥo cӫa các thành
phҫn trang mӝt cách nhiӅu hơn bҵng cách đ t chúng trong các bҧng.
Các bҧng là các lưӟi hình chӳ nhұt đưӧc chia thành các ô riêng biӋt. Thông
tin có thӇ đưӧc đ t vào tӯng ô này đӇ canh thҷng chúng theo chiӅu dӑc hay chiӅu
ngang vӟi thông tin trong các ô khác.
NӃu ta cҧm thҩy khó hình thành khái niӋm vӅ mӝt bҧng khi nó có liên quan
đӃn mӝt trang Web, h y nghĩ đӃn mӝt lӏch treo tưӡng:
Hình VIII.11. S͵ dͭng b̫ng đ͋ s̷p x͇p l͓ch
rӝt lӏch giӕng như trên là mӝt bҧng hình chӳ nhұt chӭa mӝt nhóm ô.
Trên mӝt lӏch treo tưӡng, mӛi ngày chiӃm mӝt ô riêng cӫa nó trong bҧng.
Tên cӫa mӛi ngày tӯ SUN đӃn SAT, cũng chiӃm ô riêng cӫa nó.
Các bҧng đưӧc chia thành các cӝt dӑc và các hàng ngang. Lӏch treo tưӡng
đưӧc minh hӑa có bҧy cӝt và sáu hàng.
rc đích chính cӫa các bҧng là tә chӭc thông tin vӕn phҧi đưӧc căn thҷng
vӟi các hàng và các cӝt. Ta có thӇ sӱ dng các bҧng đӇ hiӇn thӏ dӳ liӋu chҷng hҥn
như báo cáo chi phí trong các cӝt dӉ đӑc.
Răn thҷng text trong bҧng
r c dù các bҧng hӳu dng cho viӋc trình bày trang, nhưng chúng cũng là
mӝt cách hiӋu quҧ đӇ trình bày text trong các hàng và cӝt dҥng bҧng.
Bi vì ta có thӇ tҥo mӝt bҧng vӟi FrontPage, ta phҧi quyӃt đӏnh bao nhiêu
hàng và cӝt mà nó sӁ chӭa, các cӝt đưӧc đӃm tӯ trái sang phҧi và các hàng đưӧc
đӃm tӯ trên xuӕng dưӟi.
Các bҧng đưӧc hiӇn thӏ dưӟi dҥng mӝt lưӟi rӛng khi chúng đưӧc thêm vào mӝt
trang Web. Hình dưӟi minh hӑa mӝt bҧng mӟi đưӧc tҥo chӭa hai cӝt và bӕn hàng.
113
Hình VIII.12. T̩o b̫ng
Sӕ hàng và sӕ cӝt trong mӝt bҧng quyӃt đӏnh sӕ ô ban đҫu mà nó chӭa. Bҧng
hình trên chӭa 8 ô.
Thêm mӝt bҧng vào mӝt trang
rӝt bҧng rӛng khi nó đưӧc tҥo trên mӝt trang Web. Sau đó ta điӅn vào các ô
riêng lҿ cӫa nó.
ÒӇ thêm mӝt bҧng vào mӝt trang, thӵc hiӋn nhӳng bưӟc sau đây:
1.p Vӟi các trang m trong cӱa sә biên soҥn, click vào nơi mà bҧng sӁ đưӧc
chèn.
2.p Trên thanh menu chӑn Table â Insert â Table. Hӝp thoҥi Insert Table m
ra như đưӧc minh hӑa hình dưӟi
114
Hình VIII.13. H͡p tho̩i Insert Table
3.p Trong phҫn Size, sӱ dng các hӝp danh sách Rows and Columns đӇ xác lұp
kích thưӟc cӫa bҧng. Lӵa chӑn mà ta thӵc hiӋn không nhҩt thiӃt phҧi cӕ đӏnh.
Ta có thӇ thêm và bӟt các hàng và các cӝt ra khӓi bҧng khi ta làm viӋc vӟi nó.
Do đó, các giá trӏ ban đҫu không quan trӑng. Phҫn Size xác lұp các hàng, cӝt,
và sӕ ô trong bҧng, nhưng nó không quyӃt đӏnh bao nhiêu khoҧng trӕng mà
table chiӃm trên trang Web khi nó hiӇn thӏ. rӝt bҧng thưӡng chiӃm càng
nhiӅu phҫn cӫa trang càng cҫn thiӃt đӇ hiӇn thӏ nӝi dung cӫa các ô.
115
4.p ÒӇ tҥo lưӧng khoҧng trӕng mà mӝt sӕ ô sӁ chiӃm, chӑn hӝp kiӇm Specify
Width và chӑn mӝt đơn vӏ đo:
a.p Òӕi vӟi mӝt chiӅu rӝng c thӇ, chӑn mӝt tùy chӑn In Pexels và nhұp
chiӅu rӝng mà ta muӕn vào trưӡng text nҵm gҫn kӅ
b.p ÒӇ xác lұp chiӅu rӝng dưӟi dҥng tӹ lӋ phҫn trăm cӫa khoҧng trӕng có
sҹn trên trang (đưӧc đo tӯ cҥnh này sang cҥnh kia), chӑn tùy chӑn In
Percent và gõ nhұp mӝt tӹ lӋ phҫn trăm tӯ 1 đӃn 100 vào trưӡng text
nҵm gҫn kӅ.
c.p NӃu ta chӑn mӝt chiӅu rӝng 100%, bҧng sӁ chiӃm tҩt cҧ mà nó có thӇ
chiӃm.
5.p ÒӇ xác lұp chiӅu cao cӫa bҧng, l p lҥi bưӟc 4 vӟi trưӡng Height.
Có thêm ba cách đӇ tinh chӍnh mӝt bҧng là xác lұp các giá trӏ đưӡng viӅn,
khoҧng cách đӋm ô và khoҧng cách ô cӫa nó.
Òưӡng viӅn (border) xác đӏnh kích thưӟc cӫa đưӡng viӅn bao quanh bҧng.
NӃu nó đưӧc xác lұp sang 0, đưӡng viӅn và tҩt cҧ đưӡng lưӟi cӫa nó sӁ biӃn mҩt.
Các ô cӫa bҧng sӁ vүn căn thҷng mӝt cách chính xác, nhưng sӁ không rõ ràng cho
thҩy rҵng mӝt bҧng đang đưӧc sӱ dng trên trang.
Khoҧng cách đӋm ô (cell padding) là lưӧng khoҧng trӕng bao quanh nӝi
dung cӫa mӛi ô. NӃu ta tăng padding tӯ giá trӏ m c đӏnh là 1, các ô sӁ tr nên lӟn
hơn trong khi nӝi dung cӫa nó sӁ vүn giӳ cùng mӝt kích cӥ.
Khoҧng cách ô (cell spacing) là lưӧng khoҧng trӕng trong đưӡng viӅn lưӟi
giӳa ô. ÒiӅu này làm cho chiӅu rӝng và chiӅu cao cӫa các trưӡng lưӟi tr nên lӟn
hơn, nӃu đưӡng viӅn có thӇ nhìn thҩy đưӧc. Khi khoҧng cách đưӡng tăng, bҧng m
rӝng trong khi các ô vүn giӳ cùng mӝt kích cӥ.
1.p Trong hӝp thoҥi Insert Table, sӱ dng các hӝp danh sách Border, Cell
Padding, và Cell Spacing đӇ xác lұp các giá trӏ này khi cҫn thiӃt.
2.p Khi ta hoàn tҩt viӋc xác lұp bҧng, click nút OK.
Thêm dӳ liӋu vào mӝt bҧng

Khi ta có mӝt bҧng trên mӝt trang, ta có thӇ thêm các text vào bҩt kǤ ô cӫa
nó: click con trӓ trong mӝt ô và bҳt đҫu nhұp. Ta cũng có thӇ sӱ dng các lӋnh cҳt,
sao chép và dán ho c rê và thҧ đӇ điӅn đҫy mӝt ô.
116
Các bҧng bҳt đҫu vӟi tҩt cҧ ô và hàng có cùng mӝt kích cӥ và FrontPage cӕ
gҳng làm cho chúng có cùng mӝt kích cӥ khi ta thêm text. Tӯ bao bӑc xung quanh
mép phҧi cӫa mӝt ô như thӇ nó nҵm trên lӅ phҧi cӫa mӝt trang.
Khi ta điӅn đҫy mӝt bҧng, nhҩn phím Tab đӇ nhҧy đӃn ô kӃ tiӃp nҵm bên
phҧi (ho c hàng kӃ tiӃp) ho c nhҩn các phím Shift và Tab cùng mӝt lúc đӇ di
chuyӇn theo hưӟng ngưӧc lҥi.
rӝt điӅu khác thưӡng xҧy ra nӃu ta nhҩn Tab khi ta ô sau cùng trong bҧng
(ô hàng dưӟi cùng và cӝt nҵm tұn cùng bên phҧi): FrontPage tҥo mӝt hàng mӟi
và di chuyӇn con trӓ vào ô đҫu tiên trên hàng này.
ÒiӅu này cho phép ta tiӃp tc thêm dӳ liӋu mӟi vào mӝt bҧng ngay cҧ nӃu ta
đánh giá thҩp sӕ hàng mà ta cҫn khi nó đưӧc tҥo.
ÒӇ thêm mӝt ho c nhiӅu cӝt ho c hàng vào mӝt bҧng, thӵc hiӋn các bưӟc sau
đây:
1.p Click mӝt ô nҵm kӅ nơi các ô mӟi sӁ đưӧc chèn vào.
2.p Trên thanh menu chӑn Table â Insert â Rows or Columns. Hӝp thoҥi
Insert Rows or Columns xuҩt hiӋn (hình dưӟi)
Hình VIII.14. H͡p tho̩i Insert Rows or Columns
3.p Chӑn các tùy chӑn Columns ho c Rows

4.p Chӑn sӕ cӝt ho c hàng đӇ chèn trong hӝp danh sách Number Of. Chúng
đưӧc thêm kӃ bên ô đưӧc chӑn bưӟc 1.
5.p Trong phҫn Position, chӑn mӝt tùy chӑn đӇ quyӃt đӏnh chính xác nơi mà các
cӝt ho c hàng mӟi sӁ đưӧc đ t đó.
6.p Click OK.
117
Loҥi bӓ các hàng hoһc cӝt ra khӓi bҧng
Các hàng và cӝt cũng có thӇ bӏ xóa sau khi ta đ chӑn chúng:
1.p Ò t con trӓ lên trên đưӡng viӅn bҧng bên ngoài cӫa mӝt hàng ho c cӝt mà ta
muӕn xóa. Di chuyӇn con trӓ xung quanh đưӡng viӅn đó đӃn khi nó thay đәi
thành mӝt mũi tên nhӓ màu đen trӓ vào bҧng.
2.p Click mӝt lҫn. Hàng ho c cӝt theo hưӟng cӫa mũi tên đưӧc bұt sáng.
3.p ÒӇ xóa nó, nhҩn phím Delete ho c click chuӝt phҧi vào vùng đưӧc bұt sáng
và chӑn Delete Rows ho c Delete Columns tӯ menu tҳt vӯa xuҩt hiӋn.
Thay đәi kích cӥ cӫa mӝt bҧng
Theo luұt chung, FrontPage đӏnh kích cӥ cӫa mӝt bҧng đӇ tҩt cҧ các ô chiӃm
cùng mӝt lưӧng khoҧng trӕng trӯ khi mӝt sӕ trong chúng chӭa text quá lӟn đӃn nӛi
không thӇ thӵc hiӋn đưӧc điӅu này.
rӝt cách dӉ dàng đӇ đӏnh dҥng mӝt bҧng sao cho nó chiӃm ít khoҧng trӕng
hơn là thu nhӓ nó đӇ nó chiӃm lưӧng khoҧng trӕng tӕi thiӇu cҫn thiӃt: click bҩt cӭ
nơi nào trên bҧng và chӑn (trên thanh menu) Table â AutoFit to Contents.
Ta cũng có thӇ đӏnh lҥi kích cӥ mӝt bҧng đӇ các hàng và cӝt c thӇ có chiӅu
rӝng pixel ho c tӹ lӋ phҫn trăm c thӇ:
1.p Click chuӝt phҧi vào mӝt trong các ô trong hàng ho c cӝt đó.
2.p Trong menu tҳt vӯa m ra, chӑn lӋnh menu Cell Properties. Hӝp thoҥi Cell
Properties xuҩt hiӋn, hӝp thoҥi này có thӇ đưӧc sӱ dng đӇ xác lұp chiӅu
rӝng cӫa mӝt ô theo cùng mӝt cách như mӝt bҧng đưӧc cҩu hình.
118
Hình VIII.15. H͡p tho̩i Cell Properties
3.p ÒӇ xác lұp chiӅu rӝng cӫa ô đó, chӑn hӝp kiӇm Specify Width, chӑn In
Pixels ho c In Percent, và sau đó nhұp mӝt giá trӏ vào trưӡng text nҵm gҫn
kӅ.
4.p Òӕi vӟi chiӅu cao, chӑn Specify Height và l p lҥi các hưӟng dүn bưӟc 3.
5.p NӃu ta muӕn loҥi bӓ mӝt giá trӏ chiӅu cao ho c chiӅu rӝng cho mӝt ô, xóa
dҩu kiӇm ra khӓi hӝp Specify Height ho c hӝp Specify Width. NӃu các ô
khác trong hàng ho c cӝt đó không đưӧc xác lұp các giá trӏ, tҩt cҧ các ô đưӧc
hiӇn thӏ vӟi cùng mӝt kích cӥ.
6.p Click OK.
FrontPage có thӇ sӱ dng các kích thưӟc mӟi cӫa ô đӇ quyӃt đӏnh các ô khác
trong cùng mӝt hàng và cӝt sӁ đưӧc đӏnh kích cӥ như thӃ nào.
Luұt chung sau đ đưӧc áp dng: NӃu ô là ô lӟn nhҩt trong hàng ho c cӝt cӫa
nó, thì các ô khác sӁ đưӧc m rӝng đӇ có cùng mӝt kích cӥ.
Khi ta xác lұp đưӧc kích thưӟc cho mӝt ô bҧng c thӇ, ta không nên sӱ dng
lҥi Table â AutoFit to Contents nӃu không ta sӁ hӫy nhӳng thay đәi cӫa ta.
119
VIII.2.4. Hi͛n thͣ hình ̻nh trên mͱt trang Web
Làm viӋc vӟi các ҧnh theo các dҥng khác nhau
Trưӟc khi ta bҳt đҫu làm viӋc vӟi hình ҧnh đӗ hӑa, điӅu quan trӑng là ta phҧi
biӃt loҥi nào cӫa các đӏnh dҥng ta nên sӱ dng. Sӵ minh hӑa bҵng hình ҧnh có thӇ
đưӧc biӇu diӉn trên mӝt máy tính theo hàng chc dҥng khác nhau nhưng ngưӡi
thiӃt kӃ Web cҫn quen thuӝc vӟi ba dҥng: GIF, JPEG, và PNG.
Ta đ có mӝt vài trong sӕ các file này trên máy tính cӫa Graphic Interchange
Format (GIF) ho c Joint Photographic Experts Group (JPEG). rӝt dҥng mӟi hơn
mà nó đang tr nên phә biӃn là Portable Network Graphics (PNG).
Dҥng GIF
Dҥng GIF chӭa các ҧnh đưӧc giӟi hҥn chӍ 256 màu. Dҥng này lý tưng cho
các ҧnh có nhiӅu màu đӗng nhҩt (các nút menu), các ҧnh đӗ hӑa nhӓ (các biӇu
tưӧng, quҧng cáo), và nhӳng hình ҧnh khác vӕn không đòi hӓi chi tiӃt rõ nét.
NӃu mӝt ҧnh chp đưӧc hiӇn thӏ dưӟi dҥng GIF, đҫu tiên nó phҧi đưӧc làm
giҧm sao cho không quá 256 màu xuҩt hiӋn khác nhau trong ҧnh.
Dҥng GIF hӛ trӧ hai hiӋu ӭng đ c biӋt thưӡng thҩy trên Web: đӝ trong suӕt
và hoҥt hình.
Òӝ trong suӕt (transparency) là mӝt kӻ thuұt nhҵm làm cho mӝt phҫn cӫa
mӝt ҧnh hòa hӧp vӟi nӅn cӫa trang, nӅn có thӇ là mӝt màu đӗng nhҩt ho c mӝt ҧnh.
Òӝ trong suӕt sӁ làm viӋc bҵng cách chӍ đӏnh mӝt màu trong mӝt ҧnh GIF làm màu
trong suӕt, màu này sӁ không đưӧc hiӇn thӏ khi ҧnh đưӧc hiӇn thӏ trên mӝt trang
Web. ÒӇ thҩy đưӧc trӵc tiӃp điӅu này, h y xem hai ҧnh GIF trên mӝt trang trong
hình dưӟi
Hình VIII.16. ̪nh trong su͙t và ̫nh không trong su͙t
120
rӝt ҧnh GIF có thӇ đưӧc tҥo đӗng bҵng cách hiӇn thӏ mӝt sӕ ҧnh GIF có liên
quan theo trình tӵ. Nhӳng ҧnh này đưӧc lưu trӳ cùng vӟi nhau trong mӝt file đơn
vӟi thông tin vӅ khoҧng thӡi gian bao lâu đӇ hoàn thành mӝt ҧnh, thӭ tӵ cӫa sӵ hiӇn
thӏ, và sӕ lҫn đӇ l p lҥi qua trình tӵ.
Chҳc ta đ thҩy hàng trăm ҧnh đӝng khi ta duyӋt Web; chúng cũng là mӝt
công nghӋ mà các nhà quҧng cáo ưa thích.
Dҥng JPEG
Dҥng FPEG chӭa các ҧnh có chҩt lưӧng ҧnh chp vӕn có thӇ chӭa hàng ngàn
màu khác nhau. ÒӇ làm cho kích cӥ file tr nên hӧp lý, làm cho ҧnh tҧi nhanh hơn
trên Web ho c đưӧc truyӅn tҧi bi phương tiӋn khác, JPEG sӱ dng mӝt kӻ thuұt
nén dӳ liӋu nhҵm làm cho kích cӥ file nhӓ hơn nhưng bù lҥi chҩt lưӧng ҧnh bӏ mҩt.
Khi mӝt file JPEG đưӧc tҥo ra bi mӝt camera kӻ thuұt sӕ, máy quét ho c
phҫn mӅm, thì ngưӡi ta cҫn đҥt đưӧc sӵ cân bҵng giӳa kích cӥ và chҩt lưӧng. Òӝ rõ
nét và chiӅu sâu ҧnh càng cao thì kích cӥ cӫa file càng lӟn.
Do nén, JPEG thưӡng là lӵa chӑn thích hӧp nhҩt cho các ҧnh phӭc tҥp vӟi sӕ
màu lӟn. Các file JPEG thích hӧp đӕi vӟi viӋc hiӇn thӏ các ҧnh chp đưӧc quét vӕn
không có các vùng màu đӗng nhҩt.
JPEG thưӡng là lӵa chӑn kém cho các ҧnh vӟi các vùng lӟn có mӝt màu đơn.
Do cách xӱ lý viӋc nén, các đưӡng gӧn sóng (thưӡng đưӧc gӑi là ³răng cưa´) sӁ
xuҩt hiӋn trông mӡ hơn.
Dҥng PNG
Dҥng PNG đ đưӧc giӟi thiӋu đӇ thay thӃ và cҧi tiӃn dҥng GIF và JPEG. Nó
có thӇ đưӧc sӱ dng đӇ hiӇn thӏ các ҧnh có 256 màu ho c ít hơn, giӕng như mӝt
dҥng GIF (dҥng PNG-8), các ҧnh có hàng ngàn màu, giӕng như mӝt dҥng JPEG
(dҥng PNG-24). Các ҧnh PNG cũng có thӇ hӛ trӧ đӝ trong suӕt và các hiӋu ӭng đ c
biӋt khác.
Nhӳng nhà thiӃt kӃ Web site đ thong thҧ trong viӋc chӑn PNG bi vì nó
không luôn đưӧc hӛ trӧ trong các trình duyӋt Web. Internet Explorer 4 và Netscape
Navigator 4 nhӳng ҩn bҧn đҫu tiên cӫa mӝt trong hai chương trình này vӕn có thӇ
hiӇn thӏ các ҧnh đӗ hӑa PNG mà không cҫn trӧ giúp cӫa mӝt plug-in (mӝt chương
trình m rӝng các tính năng cӫa mӝt trình duyӋt).
121
Ngày nay, các phiên bҧn hiӋn hành cӫa năm trình duyӋt thông dng nhҩt ±
Internet Explorer, Netscape Navigator, rozilla, Opera, và Safari - hӛ trӧ PNG, m c
dù hҫu hӃt các trình duyӋt không hӛ trӧ tҩt cҧ các tính năng cӫa nó.
Chӑn dҥng thích hӧp
Bҵng cách sӱ dng FrontPage, ta có thӇ thêm các ҧnh đӗ hӑa sang mӝt site
theo nhiӅu dҥng khác mà ta có thӇ quen thuӝc: BrP (Windows Bitmaps), EPS
(Encapsulated PostScript), RAS (Raster), TGA (Truevision Targa Graphics
Adapter), Tiff (Tagged Image File), và WrF (Windows reta File).
Khi ta thêm mӝt trong các ҧnh này vào mӝt trang và sau đó lưu nó,
FrontPage sӁ chuyӇn đәi nó sang dҥng GIF nӃu nó chӭa 256 màu ho c ít hơn, ho c
dҥng JPEG nӃu nó chӭa nhiӅu hơn.
Phҫn mӅm khuyӃn khích ta sӱ dng GIF ho c JPEG.
Quy tҳc chung là sӱ dng JPEG cho các ҧnh chp và sӱ dng GIF ho c PNG
cho mӑi thӭ khác. Khi mӝt ҧnh JPEG phӭc tҥp ho c lӟn đӃn mӭc kích cӥ file cӫa
nó là 30KB ho c lӟn hơn, ta h y làm cho ҧnh tr nên đơn giҧn hơn ho c thay thӃ nó
bҵng mӝt ҧnh khác. ÒiӅu này ngăn ҧnh chiӃm mӝt lưӧng thӡi gian quá nhiӅu đӇ
xuҩt hiӋn khi mӝt ngưӡi dùng Web xem nó trên mӝt trang bҵng mӝt mӕi liên kӃt
modem quay sӕ.
Thêm mӝt ҧnh vào mӝt trang
Bây giӡ ta đ biӃt đôi chút vӅ các ҧnh đӗ hӑa, ta sҹn sàng đ t chúng lên trên
các trang Web riêng cӫa ta.
Trong FrontPage, hình ҧnh đưӧc thêm vào mӝt trang Web khi nó đang đưӧc
hiӋu chӍnh. Ta có thӇ thӵc hiӋn điӅu này bҵng nhiӅu cách: Ta có thӇ rê mӝt file tӯ
mӝt thư mc ho c Windows Explorer; sao chép nó sang Clopboard và dán nó trên
trang; chӑn Insert â Picture â From File; ho c nhҩp mӝt nút.
Tùy chӑn sau cùng là dӉ nhҩt, do đó nó đưӧc sӱ dng trong phҫn này.
ÒӇ thêm mӝt ҧnh vào mӝt trang Web, h y thӵc hiӋn các bưӟc sau:
1.p r trang mà ta muӕn hiӋu chӍnh
2.p Ò t con trӓ tҥi vӏ trí trên trang nơi ҧnh sӁ hiӇn thӏ
3.p Trên menu hӋ thӕng, chӑn Insert â Picture â From File trên thanh công
c Standard.Hӝp thoҥi Picture xuҩt hiӋn. Sӱ dng hӝp thoҥi này đӇ tìm
thư mc chӭa ҧnh. Ta không thӇ nhӟ tên cӫa ҧnh mà ta muӕn phҧi
122
không ? H y click vào bên phҧi cӫa nút Views và chӑn Thumbnails tӯ
menu bұt lên vӯa xuҩt hiӋn. Các ҧnh có kích cӥ thu nhӓ cӫa mӛi hình ҧnh
sӁ đưӧc hiӇn thӏ, như đưӧc minh hӑa trong hình dưӟi.
Hình VIII.17. Ch͕n ̫nh
4.p Chӑn ҧnh và click insert. File đưӧc hiӇn thӏ như mӝt phҫn cӫa trang trong
cӱa sә hiӋu chӍnh, cho phép ta xem diӋn mҥo cӫa nó ngay lұp tӭc.
Khi mӝt ҧnh đưӧc đ t trên mӝt trang, phҫn nӝi dung trang sӁ di chuyӇn đӇ
dành chӛ trӕng. Text và các thành phҫn trang khác chҧy xung quanh ho c bên dưӟi
trang. ÒӇ di chuyӇn ҧnh, nhҩp kéo rê nó đӃn mӝt vӏ trí mӟi.
r c dù dưӡng như ҧnh đ đưӧc trӝn vӟi trang Web, nhưng nó vүn nҵm trong
file riêng cӫa nó ± file mà ta đ chӑn bҵng hӝp thoҥi Picture.
Trình bày hình ҧnh vӟi text
Lҫn đҫu tiên ta thêm mӝt ҧnh vào mӝt phҫn cӫa text trong FrontPage, có thӇ ta
không hài lòng vӟi diӋn mҥo cӫa nó. Text chҥy mӝt cách vng vӅ tӯ mép cӫa ҧnh,
đӇ lҥi nhiӅu khoҧng trӕng xung quanh nó.
123
ViӋc chӑn mӝt kiӇu bao bӑc (wrapping style) mӟi cho ҧnh sӁ xӱ lý vҩn đӅ
này. KiӇu bao bӑc là mӝt xác lұp click đӇ chӑn ҧnh sӁ đưӧc hiӇn thӏ như thӃ nào
tương ӭng vӟi text nҵm gҫn kӅ và nӝi dung khác trên trang.
ÒӇ chӑn kiӇu bao bӑc ҧnh, h y thӵc hiӋn các bưӟc sau:
1.p Click đúp vào ҧnh. Hӝp thoҥi Picture Properties m ra (xem hình dưӟi)
Hình VIII.18. H͡p tho̩i Picture Properties

2.p NӃu tab Appearance không xuҩt hiӋn, click tên tab đó đӇ đưa nó lên phía
trên.
3.p Chӑn mӝt trong các tùy chӑn nҵm bên dưӟi tiêu đӅ chính Wrapping Style
± click biӇu tưӧng nҵm trên các nh n None, Left, ho c Right. Các biӇu
tưӧng cho biӃt cách ҧnh sӁ đưӧc đ t như thӃ nào tương ӭng vӟi text.
4.p ÒӇ thêm ho c giҧm lưӧng khoҧng trӕng giӳa các cҥnh cӫa ҧnh và text,
h y điӅu chӍnh xác lұp Horizonal Spacing.
5.p ÒӇ bә sung ho c loҥi bӓ mӝt sӕ khoҧng trӕng nҵm trên đӍnh và đáy, h y
điӅu chӍnh phҫn Vertical Spacing.
124
6.p Click OK. Khi hӝp thoҥi Picture Properties đóng lҥi và ta sӁ thҩy kӃt quҧ
trên trang cӫa ta.
KiӇu bao bӑc cӫa mӝt ҧnh chӍ quyӃt đӏnh cách nó đưӧc hiӇn thӏ bên text nҵm
gҫn kӅ.
ÒӇ thêm mӝt khoҧng dòng trӕng trưӟc và sau mӝt ҧnh, h y đ t con trӓ nҵm
bên trái ho c bên phҧi cӫa ҧnh và nhҩn Enter đӇ chèn mӝt ngҳt đoҥn. ÒӇ chèn mӝt
ngҳt dòng nhӓ hơn, h y nhҩn Shift + Enter.
rӝt cách khác đӇ tҥo tùy biӃn vӏ trí cӫa mӝt ҧnh là sӱ dng xác lұp căn chӍnh
cӫa nó.
Xác lұp này tương tӵ như kiӇu bao bӑc, quyӃt đӏnh cách mӝt ҧnh sӁ đưӧc căn
thҷng kӃ bên các ҧnh và text khác có chiӅu bao bӑc.
ÒӇ xác lұp kiӇu căn chӍnh cӫa mӝt ҧnh, h y thӵc hiӋn các bưӟc sau:
1.p Click đúp vào ҧnh. Hӝp thoҥi Picture Properties m ra.
2.p NӃu tab Appearance không xuҩt hiӋn, click tên cӫa tab đӇ đưa nó lên phía
trên.
3.p Bên dưӟi tiêu đӅ chính Layout, chӑn mӝt trong các tùy chӑn cӫa hӝp danh
sách Alignment:
a.p Left alignment và Righe alignment ± làm cho ҧnh xuҩt hiӋn phía
bên trái ho c bên phҧi cӫa text xung quanh.
b.p Top alignment ± căn thҷng các mép đӍnh cӫa ҧnh và text.
Bottom alignment ± căn thҷng các mép đáy cӫa ҧnh và text. Òây
cũng là kiӇu căn chӍnh m c đӏnh cho mӝt ҧnh mӟi.
c.p roddle alignment ± căn thҷng phҫn chính cӫa ҧnh so vӟi đáy cӫa
text.
d.p Absolute roddle alignment ± căn thҷng phҫn chính giӳa cӫa ҧnh
vӟi phҫn chính giӳa cӫa text.
Có nhiӅu tùy chӑn khác, nhưng tҩt cҧ chúng tương tӵ như sáu tùy chӑn này.
Ta có thӇ sӱ dng các tùy chӑn căn chӍnh text, hình ҧnh, ho c bҩt cӭ nhӳng gì khác
vӕn đӫ nhӓ đӇ hiӇn thӏ.
4.p Click OK.
125
Thêm mӝt liên kӃt (Hyperlink)
Bҩt kǤ text ho c đӗ hӑa trên mӝt trang Web có thӇ có mӝt hyperlink đưӧc
kӃt hӧp vӟi nó. Liên kӃt này có thӇ trӓ vào mӝt trang ho c mӝt file trên cùng mӝt
Web site, mӝt site trên Web, ho c bҩt kǤ nguӗn tài nguyên khác vӕn có mӝt đӏa chӍ
internet.
ÒӇ thêm mӝt hyperlink vào mӝt ҧnh, h y thӵc hiӋn các bưӟc sau:
1.p Click vào ҧnh. Các núm nhӓ xuҩt hiӋn tҥi các góc và cҥnh cӫa ҧnh đӇ biӇu
thӏ rҵng nó đ đưӧc chӑn cho viӋc hiӋu chӍnh.
2.p Click nút Insert Hyperlink trên thanh công c Standard. Hӝp thoҥi Insert
Hyperlink m ra, như đưӧc minh hӑa hình dưӟi. Hӝp này có thӇ đưӧc
sӱ dng đӇ chӑn nhiӅu loҥi liên kӃt:
a.p NӃu liên kӃt dүn đӃn mӝt trang Web ho c file khác trên máy tính
cӫa ta, sӱ dng hӝp thoҥi này đӇ tìm và nhұp file đó. Tên cӫa nó
xuҩt hiӋn trong trưӡng Address.
b.p NӃu liên kӃt là mӝt đӏa chӍ email, click biӇu tưӧng Email Address
trong khung Link To. Hӝp thoҥi sӁ hiӇn thӏ trưӡng Email Address
và trưӡng subject. ÒiӅn thông tin vào nhӳng trưӡng này.
c.p NӃu liên kӃt là mӝt đӏa chӍ Web khác, nhұp nó vào trưӡng Address
(ho c sao chép đӏa chӍ tӯ thanh Address cӫa trình duyӋt Web và
dán nó vào trưӡng.
126
Hình VIII.19. H͡p tho̩i Insert Hyperlink
3.p ÒӇ m trình duyӋt và tìm đúng đӏa chӍ, click nút Browse the Web (hình
trên).
4.p Click OK.
Thêm mӝt chú thích
rӝt trong nhӳng cách đӇ làm cho các trang Web cӫa ta tr nên khҧ dng hơn
là cung cҩp cho mӛi ҧnh mӝt chú thích nhҵm mô tҧ ҧnh.
Khi mӝt trang đang đưӧc tҧi xuӕng, mӝt sӕ trình duyӋt Web hiӇn thӏ chú
thích cӫa mӝt ҧnh trong vùng đưӧc chiӃm bi ҧnh đó.
NӃu ҧnh đang đưӧc sӱ dng là mӝt nút menu ho c cho mӝt sӕ mc đích đӏnh
hưӟng nào đó, chú thích cho phép nhӳng ngưӡi dùng cӫa ta tұn dng nó trưӟc khi
ҧnh đưӧc tҧi xuӕng. Nhӳng ngưӡi sӱ dng mӝt kӃt nӕi Internet chұm (56.6K ho c
thҩp hơn) sӁ cҧm kích cách cư xӱ tao nh này, đ c biӋt nӃu ҧnh lӟn.
Các nӝi dung mô tҧ text cũng là cách duy nhҩt mà mӝt trình duyӋt Web chӍ
text chҷng hҥn như Linux có thӇ làm cho bҩt kǤ ҧnh tr nên có ý nghĩa. NӃu mӝt
ҧnh phҧi đưӧc nҩp đӇ hưӟng Web cӫa ta, thì nó nên có text đӇ mô tҧ mc đích cӫa
nó.
127
Bҵng cách cung cҩp text này, ta cung cҩp thêm thông tin vӅ các nӝi dung cӫa
trang mà các công c tìm kiӃm có thӇ tұn dng. Dӏch tìm kiӃm Google Images tҥi
images.google.com, hiӇn thӏ các ҧnh phù hӧp vӟi mӝt ho c nhiӅu tӯ khóa, tұn dng
các chú thích.
Ta cũng cung cҩp thông tin cҫn thiӃt cho nhӳng ngưӡi dùng bӏ khuyӃt tұt đӇ
sӱ dng Web site cӫa ta, nhҵm tang khҧ năng truy cұp.
rc đích truy cұp, là mӝt trong nhӳng chӫ đӅ nóng bӓng nhҩt cӫa nhӳng nhà
thiӃt kӃ Web ngày nay, là bҧo đҧm rҵng Website có thӇ đưӧc sӱ dng vӟi các bӝ
đӑc màn hình đӗ hӑa công nghӋ hӛ trӧ khác. Bҵng cách cung cҩp chú thích cho mӛi
ҧnh - đ c biӋt các ҧnh đưӧc kӃt hӧp các hyperlink - ta m rӝng nhӳng ngưӡi xem
tương lai đӕi vӟi mӝt site.
ÒӇ thêm mӝt chú thích vào mӝt ҧnh ho c hiӋu chӍnh mӝt chú thích hiӋn có,
h y thӵc hiӋn các bưӟc sau:
1.p H y click đúp ҧnh. Hӝp thoҥi Picture Properties sӁ m ra.
2.p Click tab General đӇ đưa nó lên phía trưӟc. Tab này có thӇ đưӧc sӱ dng đӇ
thay đәi ho c thay thӃ mӝt ҧnh, chӑn mӝt hyperlink, ho c cung cҩp mӝt chú
thích và mӝt thông tin mô tҧ khác.
3.p Nhұp mӝt chú thích ngҳn gӑn cho ҧnh trong trưӡng text (ho c thay thӃ chú
thích hiӋn có, nӃu có), như đưӧc minh hӑa trong hình dưӟi
128
Hình VIII.20. Thêm m͡t chú thích vào m͡t ̫nh
4.p Click OK.
ÒӇ xem trang cӫa ta trông giӕng như thӃ nào mà không có ҧnh, hҫu hӃt các
trình duyӋt Web có thӇ đưӧc cҩu hình đӇ ngưng hiӇn thӏ chúng. Trong Internet
Explorer 6, h y thӵc hiӋn các bưӟc sau:
1.p Trên menu hӋ thӕng chӑn Tool â Internet Options. Hӝp thoҥi Internet
Options đưӧc m ra.
2.p Click tab Advanced đӇ đưa nó lên phía trưӟc.
3.p Cuӝn xuӕng danh sách Setting cho đӃn khi ta tìm thҩy phҫn rultimedia.
4.p Xóa dҩu kiӇm kӃ bên hӝp kiӇm Show Picture.
5.p Click OK.
Các ҧnh sӁ không đưӧc hiӇn thӏ trong các trang Web mà ta tҧi sau điӇm đó,
m c dù mӝt sӕ trang trong cache ho c bӝ nhӟ đӋm vүn còn cung cҩp các hình ҧnh
đӗ hӑa.
Ta có thӇ m lҥi chӃ đӝ hiӇn thӏ ҧnh bҵng cách chӑn hӝp kiӇm Show Pictures.
Thêm mӝt Rlip Art vào mӝt ҧnh
129
FrontPage 2003 có mӝt thư viӋn chӭa hàng ngàn ҧnh clip art, ҧnh chp, và
các file đa phương tiӋn khác. Nhӳng ҧnh này có thӇ đưӧc kӃt nhұp vào trong các
trang Web riêng cӫa ta.
Thư viӋn clip art chӭa FrontPage và bҩt kǤ sҧn phҭm Of-fice khác mà ta đ
sӱ dng, chҷng hҥn như các phiên bҧn trưӟc cӫa FrontPage. Nó cũng có thӇ chӭa
mӝt sӕ ҧnh đӗ hӑa, ҧnh chp kӻ thuұt sӕ, và các ҧnh khác trên máy tính cӫa ta ±
ricrosoft Clip Organizer đưӧc đính kèm vӟi Office tìm kiӃm trên máy tính cӫa ta
dành cho cá file ҧnh đӗ hӑa và đa phương tiӋn khác.
ÒӇ tìm và thêm clip art vào mӝt trang, thӵc hiӋn các bưӟc sau:
1.p Ò t con trӓ tҥi vӏ trí nơi ҧnh sӁ đưӧc chèn vào.
2.p Trên menu hӋ thӕng chӑn Insert â Picture â Clip Art. Khung Clip Art
m ra nҵm bên phҧi cӫa bӝ biên soҥn (xem hình dưӟi). Ta cũng có thӇ
đưӧc hӓi xem Clip Organizer có nên đưӧc lұp hҥng mc cho các file đa
phương tiӋn trên hӋ thӕng cӫa ta hay không. ÒiӅu này mҩt nhiӅu thӡi gian
và có thӇ đưӧc hiӋn vào bҩt cӭ lúc nào, do đó không cҫn phҧi thӵc hiӋn nó
ngay lұp tӭc.
Hình VIII.21. Tìm ki͇m Clip Art
130
3.p Trong khung Clip Art, nhұp mӝt ho c nhiӅu tӯ vào trong hӝp Search For
nhҵm mô tҧ loҥi ҧnh mà ta tìm.
4.p ÒӇ thӵc hiӋn mӝt tìm kiӃm, ta h y sӱ dng hӝp danh sách Search In.
FrontPage có thӇ tìm kiӃm tұp hӧp clip art riêng cӫa nó, ҧnh Office khác,
các clip mà ta đ tә chӭc, ho c tҩt cҧ ba thӭ này cùng mӝt lúc.
5.p ÒӇ thu hҽp thêm nó, h y sӱ dng hӝp danh sách Results Souuld Be. Thư
viӋn clip art chӭa các loҥi đa phương tiӋn: các bҧn vӁ clip art, các ҧnh
chp, phim và âm thanh. Ta có thӇ tìm kiӃm mӝt loҥi tҩt cҧ chúng.
6.p Click nút Go. Các file phù hӧp vӟi viӋc tìm kiӃm cӫa ta đưӧc hiӇn thӏ
trong khung. Các ҧnh thumbnail cӫa mӛi ҧnh clip art và các ҧnh chp
đưӧc hiӇn thӏ - sӱ dng thanh cuӝn đӇ xem chúng. Hình trên thӇ hiӋn kӃt
quҧ tìm kiӃm.
7.p Khi ta tìm đưӧc mӝt ҧnh mà ta thích, n y click đúp vào nó, ҧnh sӁ xuҩt
hiӋn trên trang, thưӡng vӟi kích cӥ lӟn hơn nhiӅu so vӟi nhӳng gì mà ta
mong muӕn. Ta sӁ có thӇ đӏnh lҥi kích cӥ ҧnh này khi cҫn thiӃt.
Clip Art tӯ thư viӋn thưӡng lӟn hơn nhiӅu so vӟi nhӳng gì ta mong đӧi. ÒiӅu
này là do phҫn thiӃt kӃ bi vì ta có thӇ dӉ dàng thu nhӓ mӝt ҧnh sang mӝt kích cӥ
mà ta muӕn mà không làm mҩt chҩt lưӧng ҧnh cӫa nó. ViӋc tăng kích cӥ và duy trì
mӝt chҩt lưӧng thì khó hơn nhiӅu (thưӡng không thӵc hiӋn đưӧc).
Khi ta thêm clip art vào mӝt trang, ҧnh gӕc vүn nҵm trong thư viӋn. Nhӳng
thay đәi mà ta thӵc hiӋn vӟi ҧnh sӁ không thay đәi bҧn gӕc cӫa ҧnh.
NӃu ta không thӇ tìm thҩy clip art phù hӧp trong thư viӋn đưӧc đính kèm vӟi
FrontPage 2003, thì các file đa phương tiӋn khác dành cho các trang Web cӫa ta có
sҹn trên Web site ricrosoft Office Online. ÒӇ đi đӃn đó, h y thӵc hiӋn các bưӟc sau:
1.p NӃu khung Clip Art không đưӧc m, h y chӑn Insert â Picture â Clip
Art.
2.p Click liên kӃt Clip Art on Office Online nҵm cuӕi cùng.
Trình duyӋt Web cӫa ta m ra tҥi ricrosoft Office Clip Art and redia site,
nơi ta có thӇ duyӋt theo tӯng hҥng mc ho c tìm kiӃm các tӯ khóa c thӇ.
Các file mà ta chӑn tӯ Office Online đưӧc nhұp tӵ đӝng vào thư viӋn clip art
cӫa FrontPage 2003.
131
Thay đәi kích cӥ cӫa mӝt ҧnh
Kích cӥ cӫa bҩt kǤ ҧnh nào trên mӝt trang Web đӅu có thӇ thay đәi đưӧc -
đưӧc tăng đӃn mӝt kích cӥ lӟn hơn, đưӧc thu nhӓ thành mӝt kích cӥ nhӓ, ho c
ngay cҧ đưӧc biӃn dҥng đӇ chiӅu rӝng có mӝt tӹ lӋ khác vӟi chiӅu cao.
Kích cӥ cӫa mӝt ҧnh có thӇ đưӧc thay đәi theo hai cách trong FrontPage. Ta
có thӇ đӏnh lҥi kích cӥ ҧnh thӵc, nhҵm thay đәi file chӭa ҧnh, ho c thay đәi kích cӥ
hiӇn thӏ cӫa ҧnh.
Các ҧnh đưӧc biӇu diӉn trên mӝt trang Web có thӇ đưӧc hiӇn thӏ các kích
cӥ lӟn hơn ho c nhӓ hơn kích cӥ thӵc cӫa nó, điӅu này làm cho cùng mӝt ҧnh đưӧc
trình bày vӟi nhӳng kích cӥ khác nhau trên hai trang khác nhau cӫa mӝt Web site.
Bi vì lý do này, nên điӅu quan trӑng là ta phҧi lưu ý đӃn sӵ khác biӋt giӳa
viӋc đӏnh lҥi kích cӥ mӝt ҧnh ± và viӋc chӍ hiӇn thӏ ҧnh vӟi mӝt kích cӥ khác, nhҵm
không thay đәi file đӗ hӑa gӕc.
NӃu ta không bao giӡ hiӇn thӏ ҧnh vӟi mӝt kích cӥ lӟn hơn, thì viӋc đӏnh lҥi
kích cӥ ҧnh là mӝt lӵa chӑn tӕt hơn vì nó sӁ tҧi nhanh hơn khi mӝt khách tham
quan xem trang Web cӫa ta. (NӃu ҧnh không bҳt nguӗn tӯ thư viӋn clip art, h y lưu
mӝt bҧn sao cӫa ҧnh lӟn hơn bҩt kǤ vӏ trí nào).
Các ҧnh clip art trông đҽp hơn khi chúng đưӧc đӏnh lҥi kích cӥ mӝt cách cӕ
đӏnh thay vì đưӧc hiӇn thӏ vӟi mӝt kích cӥ lӟn hơn bi vì FrontPage làm mӝt công
viӋc hiӋu chӍnh ҧnh nào đó trên file đӇ làm nhҹn các mép và làm rõ nét các chi tiӃt.
TiӃn trình này đưӧc gӑi là viӋc lҩy lҥi mүu (resampling) ҧnh.
ÒӇ đӏnh lҥi kích cӥ mӝt ҧnh, thӵc hiӋn các bưӟc:
1.p Click vào ҧnh. Các núm chӑn xuҩt hiӋn xung quanh các mép cӫa ҧnh, như
đưӧc minh hӑa trong hình dưӟi. Khi ta đ t chuӝt lên trên mӝt trong các
núm này, con trӓ biӃn thành mӝt mũi tên, điӅu này biӇu thӏ rҵng ta có thӇ
kéo các núm xung quanh.
2.p ÒӇ thay đәi kích cӥ cӫa ҧnh, kéo mӝt núm đӃn mӝt vӏ trí mӟi:
a.p ÒӇ thay đәi chiӅu cao, giӳ núm tҥi phҫn chính giӳa cӫa đӍnh ho c
đáy cӫa ҧnh.
b.p ÒӇ thay đәi chiӅu rӝng, giӳ núm tҥi phҫn chính giӳa cӫa cҥnh trái
và phҧi.
132
c.p ÒӇ thay đәi kích cӥ trong khi duy trì chiӅu rӝng và chiӅu cao, giӳ
bҩt kǤ góc nào.
Ҧnh thay đәi kích cӥ khi các núm đưӧc di chuyӇn, cho phép ta xem trưӟc
viӋc thay đәi trưӟc khi nó đưӧc hoàn tҩt.
3.p Nhҧ núm. rӝt hӝp nhӓ xuҩt hiӋn kӃ bên ҧnh. Click hӝp này đӇ m mӝt
menu thҧ xuӕng vӕn quyӃt đӏnh ҧnh sӁ đưӧc đӏnh lҥi kích cӥ như thӃ nào.
4.p Chӑn Only rodify Size Attributes đӇ thay đәi kích cӥ hiӇn thӏ cӫa ҧnh.
5.p Chӑn Resample Picture to ratch Size đӇ đӏnh lҥi kích cӥ ҧnh mӝt cách cӕ
đӏnh.
ÒӇ thay đәi kích cӥ, h y kéo hӝp đӃn mӝt vӏ trí mӟi đӇ làm cho ҧnh lӟn ho c
nhӓ hơn,
Sau khi clip art đ đưӧc thêm vào mӝt trang, nó có thӇ đưӧc xem như bҩt kǤ
ҧnh khác. Ta có thӇ di chuyӇn nó vòng quanh, thêm mӝt chú thích, và thӵc hiӋn
nhӳng thay đәi khác.
VIII.2.5. T̹o mͱt Web site mͳi
Ӣ trên ta đ có thӇ thӵc hiӋn các công viӋc thao tác đơn lҿ trên mӝt trang
Web. Bây giӡ ta sӁ tìm hiӇu và hӑc cách tҥo mӝt Web site mӟi ra sao.
ViӋc nhұp (importing) các file tr nên đ c biӋt tiӋn lӧi nӃu ta có mӝt sӕ tài
liӋu đưӧc tҥo bҵng ricrosoft Word ho c chương trình khác mà ta muӕn đưa lên
World Wide Web.
Tҥo mӝt Web site mӟi
FrontPage cung cҩp nhiӅu tính năng nhҵm giúp ta dӉ dàng tҥo, quҧn lý, và
xuҩt các Web site.
Các site đưӧc quҧn lý bi FrontPage đưӧc tә chӭc vӟi viӋc sӱ dng các file
thư mc cӫa máy tính. rӝt site chiӃm mӝt thư mc chính và mӝt sӕ thư mc con,
mӛi thư mc con phc v mӝt mc đích khác nhau.
Khi mӝt thư mc đ đưӧc chӍ đӏnh làm mӝt thư mc chính cho mӝt site, thì
nó không đưӧc sӱ dng cho bҩt kǤ site nào khác nӳa.
Khi FrontPage đưӧc cài đ t, mӝt thư mc ry Web Sites đưӧc tҥo bên trong
ry Documents thuӝc máy tính cӫa ta. Òây là mӝt nơi tӕt đӇ lưu trӳ các thư mc
riêng lҿ mà sӁ chӭa các site ta tҥo ra.
ÒӇ tҥo mӝt Web site mӟi ngay tӯ đҫu, chҥy FrontPage và thӵc hiӋn các bưӟc sau:
133
1.p Trên menu hӋ thӕng chӑn File â New. Khung New m ra nҵm dӑc theo
cҥnh phҧi cӫa giao diӋn FrontPage, kӃ bên cӱa sә nơi các trang Web đưӧc
biên soҥn.
2.p Click hyperlink rore Web Site Template.
Hình VIII.22. H͡p tho̩i Web Site Templates

Các Web site đưӧc tҥo trong FrontPage bҵng cách sӱ dng các template, các
phiên bҧn dӵ trӳ cӫa mӝt sӕ Web site mà ta có thӇ tҥo tùy biӃn. Ta sӁ Tìm hiӇu kӻ
hơn trong phҫn sau.
3.p Chӑn biӇu tưӧng cӫa template On-Page Web Site, template này đưӧc sӱ
dng đӇ tҥo mӝt site đơn giҧn, không chӭa gì cҧ ngoҥi trӯ mӝt trang Web
trӕng.
KӃ tiӃp, ta có thӇ tҥo mӝt thư mc mӟi trên máy tính cӫa ta nơi các site sӁ
đưӧc lưu đó.
1.p Click nút Browse. Hӝp thoҥi New Web Site Location m ra, như đưӧc
minh hӑa trong hình dưӟi.
134
Hình VIII.23. H͡p tho̩i New Web Site Locations
2.p rӛi Web site đưӧc quҧn lý bi FrontPage phҧi đưӧc cung cҩp bi thư
mc riêng cӫa nó. Trưӟc khi ta có thӇ thӵc hiӋn điӅu đó, h y tìm và m
thư mc này nơi ta sӁ lưu giӳ thư mc này ± mӝt vӏ trí thích hӧp là thư
mc ry Web Site bên trong ry Documents.
3.p ÒӇ tҥo mӝt thư mc cho site mӟi cӫa ta, h y click nút Create New Folder,
đưӧc minh hӑa trong hình trên. Hӝp thoҥi New Folder m ra.
4.p Nhұp tên thư mc mӟi trong trưӡng Name và click nút OK. Thư mc đưӧc
m và hiӇn thӏ trong menu Look In thҧ xuӕng cӫa hӝp thoҥi New Web Site
Location.
ÒӇ m mӝt trang Web trong cӱa sә biên soҥn, click đúp file. Click đúp
index.htm đӇ m trang chӫ cӫa site vӯa mӟi đưӧc tҥo đӇ hiӋu chӍnh.
ÒӇ quay tr vӅ khung xem Folder
III.2.5.Khai thác site mͳi
Khi ta tҥo mӝt Web site mӟi, FrontPage sӁ thêm tҩt cҧ file và thư mc cҫn
thiӃt kӃ vào thư mc chính cӫa site.
ÒӇ cho ta mӝt trang rõ ràng vӅ nhӳng gì mà site chӭa, nó đưӧc hiӇn thӏ trong
khung xem Folders, đưӧc minh hӑa hình dưӟi. (Có thӇ ta không nhìn thҩy khung
nhìn Folder List nҵm bên trái khung nhìn Folders).
135
Hình VIII.24. Khung nhìn Folders
Như đ biӃt, Giao diӋn ngưӡi dùng cӫa FrontPage thay đәi ph thuӝc vào
nhӳng gì mà ta đang sӱ dng nó đӇ làm viӋc. Ta có thӇ làm viӋc trên mӝt trang
trong cӱa sә biên soҥn trong khung xem Design và kiӇm tra nó trong mӝt trình
duyӋt Web trong khung nhìn Preview.
ÒӇ chuyӇn đәi tӯ mӝt khung xem này sang mӝt khung nhìn khác, click thanh
Views cuӕi mép cӫa giao diӋn.
Khung nhìn Folders làm giӕng như mӝt file thư mc - ta có thӇ kéo và thҧ
các file đӇ di chuyӇn chúng xung quanh, và ta có thӇ đәi tên ho c xóa chúng (click
chuӝt phҧi vào file và chӑn Rename ho c Delete tӯ menu tҳt).
ÒӇ m mӝt trang Web trong cӱa sә biên soҥn, click đúp vào file. Click đúp
vào index.htm đӇ m mӝt trang chӫ cӫa site vӯa mӟi đưӧc tҥo đӇ hiӋu chӍnh.
ÒӇ quay tr vӅ khung nhìn Folders, click tab Web site nҵm trên cӱa sә biên
soҥn ho c chӑn Views â Folders
Thêm mӝt trang mӟi vào mӝt Site
Ta đ biӃt rҵng FrontPage có thӇ đưӧc sӱ dng đӇ tҥo và hiӋu chӍnh các trang
Web vӕn không phҧi là mӝt phҫn cӫa bҩt kǤ Web site nào.
136
Nhӳng trang này có thӇ đưӧc thêm vào mӝt site, như đưӧc đӅ cұp phҫn kӃ tiӃp.
Ta cũng có thӇ tҥo mӝt trang mӟi vӕn đưӧc thêm vào site mà ta đang hiӋu chӍnh:
1.p Trên menu hӋ thӕng chӑn File â New đӇ m khung New nӃu nó chưa
đưӧc m.
2.p Chӑn loҥi trang ta muӕn tҥo:
Ëp Òӕi vӟi mӝt trang hoàn toàn trӕng, click hyperlink Blank Page.
Ëp Òӕi vӟi các loҥi trang khác, click liên kӃt rore Page Templates.
Hӝp thoҥi Page Templates xuҩt hiӋn, liӋt kê các loҥi template mà trang mӟi
có thӇ đưӧc dӵa vào đó. Chӑn biӇu tưӧng cӫa template mà ta muӕn và lick OK.
Trong thư mc chính cӫa site, FrontPage tҥo mӝt trang mӟi bҵng cách sӱ
dng template và đ t cho nó mӝt tên chҷng hҥn như new_page_1.htm ho c
new_page_2.htm. Tên trang sӁ có mӝt ký tӵ dҩu sao (³*´) theo sau khi nó chӭa
nhӳng thay đәi chưa đưӧc lâu.
Click nút Save trong thanh công c Standard đӇ lưu file đang hiӇn thӏ trong
cӱa sә biên soҥn. Trên menu hӋ thӕng chӑn File â Save All đӇ lưu tҩt cҧ các file
đang m hiӋu chӍnh.
ÒӇ đóng mӝt Web site, chӑn File â Close. NӃu bҩt kǤ các trang đưӧc hiӋu
chӍnh chưa đưӧc lưu, mӝt hӝp thoҥi đưӧc m ra dành cho mӛi trang hӓi có muӕn
lưu file đó hay không. Click Yes đӇ lưu file ho c No đӇ loҥi bӓ các thay đәi.
Nhұp các file vào mӝt site
World Wide Web có thӇ trình bày các loҥi tài liӋu khác ngoài các trang Web:
-p Các file ҧnh đӗ hӑa dҥng GIF, JPEG, PNG, và các dҥng khác
-p Các file âm thanh chҷng hҥn như các file WAV, rIDI và rP3
-p Các file rovie theo dҥng AVI, rOB, rPD, và QuickTime
-p Các chương trình racromedia Shockwave và Flash, và các chương trình
tương tác khác.
Khi ta tҥo mӝt site mӟi, thư mc cӫa nó sӁ chӭa mӝt thư mc con images
trong đó nơi hình ҧnh cӫa mӝt site có thӇ đưӧc lưu trӳ. NӃu ta đang làm viӋc vӟi
các loҥi media khác, ta có thӇ muӕn tҥo các thư mc dành cho chúng - chҷng hҥn
như sound cho bҩt kǤ file âm thanh mà ta đang sӱ dng.
rӝt cách đӇ kӃt hӧp nhӳng file media này và các file khác vào trong site cӫa
ta là nhұp (import) chúng vào trong site:
137
1.p Vӟi site đang m, chӑn File â Import. Hӝp thoҥi m ra, liӋt kê các file
mà ta đ chӑn đӇ nhұp vào site. NӃu ta chưa nhұp, thì danh sách rӛng.
2.p Click nút Add File. Hӝp thoҥi Add File to Import List m ra.
Hình VIII.25. H͡p tho̩i Add File to Import List

3.p Sӱ dng hӝp thoҥi này đӇ tìm và m thư mc chӭa file đó. Sau đó click
file. File đưӧc liӋt kê trong hӝp thoҥi Import.
4.p Click Add File đӇ chӑn mӝt file khác đӇ nhұp, ho c click OK đӇ nhұp các
file đưӧc chӑn vào site cӫa ta.
Các file đưӧc nhұp tr thành mӝt phҫn cӫa site. Bҩt cӭ khi nào ta sao chép
site sang mӝt thư mc mӟi ho c xuҩt bҧn nó lên World Wide Web, file đó sӁ đưӧc
đưa vào.
rӝt file nhұp có thӇ đưӧc kéo đӃn mӝt thư mc khác thuӝc site này tӯ khung
nhìn Folders ho c khung Folder List.
qóa mӝt site
rӝt Web site đưӧc quҧn lý bi FrontPage có thӇ bӏ xóa theo hai cách, mӝt sӵ
khác biӋt cӵc kǤ quan trӑng mà ta cҫn lưu ý trưӟc khi xóa mӝt site.
138
Cách thӭ nhҩt đӇ xóa mӝt site là loҥi bӓ nó hoàn toàn: ÒiӅu này sӁ xóa sҥch
thư mc chӭa site, tҩt cҧ các thư mc con cӫa nó, cùng tҩt cҧ các trang, hình ҧnh, và
các file khác vӕn tҥo nên site.
Cách thӭ hai là chӍ xóa các file và thư mc mà FrontPage sӱ dng đӇ quҧn lý
site, đӇ lҥi nguyên vҽn mӑi thӭ khác.
Khi ta làm viӋc trên mӝt Web site bҵng FrontPage, phҫn mӅm tҥo ra mӝt sӕ
thư mc và file đưӧc sӱ dng nhҵm bҧo trì site (ví d: FrontPage theo dõi khi nào
tӯng file cӫa site đưӧc xuҩt cuӕi cùng tӯ máy tính cӫa ta lên World Wide Web).
ViӋc xóa thông tin FrontPage cӫa site sӁ chӍ xóa các file và thư mc mà
FrontPage sӱ dng hұu cҧnh đӇ quҧn lý site. rӑi thӭ khác ± trang, hình ҧnh và
file khác ± không bӏ loҥi bӓ.
rӝt site không có nӝi dung FrontPage vүn đưӧc xem mӝt cách bình thưӡng
bҵng mӝt trình duyӋt Web nhưng ta sӁ không thӇ m nó đӇ hiӋu chӍnh trong
FrontPage. Ta có thӇ m các trang riêng lҿ trong site đӇ hiӋu chӍnh, nhưng ta không
thӇ áp dng mӝt theme vào mӝt site, thêm các thư mc chia sҿ vào nhiӅu trang ho c
áp dng bҩt kǤ tính năng khác có liên quan đӃn toàn bӝ mӝt site.
ÒӇ xóa mӝt vài ho c tҩt cҧ các file trong mӝt site, h y thӵc hiӋn các bưӟc sau:
1.p NӃu site đ không đưӧc m, trên menu hӋ thӕng chӑn File â Open Site.
Hӝp thoҥi Open xuҩt hiӋn, h y sӱ dng nó đӇ chӑn thư mc chính cӫa site,
và click Open.
2.p NӃu danh sách thư mc không đưӧc hiӇn thӏ, h y m nó: Click View â
Folder List.
3.p Click chuӝt phҧi vào tên cӫa site ± dòng trên cùng trong menu thư mc ±
và trong menu tҳt vӯa đưӧc m, h y chӑn lӋnh Delete (như minh hӑa
trong hình dưӟi)
139
Hình VIII.26. Xóa m͡t thư mͭc
rӝt hӝp thoҥi m ra cho phép ta xóa thông tin FrontPage ho c xóa toàn bӝ
Web site.
Cҧ hai hoҥt đӝng này đӅu mang tính vĩnh viӉn, vì thӃ ta nên cҭn thұn khi sӱ
dng chúng.
4.p ÒӇ xóa mӝt site ho c thông tin FrontPage cӫa nó, chӑn mӝt tùy chӑn và
nhҩp OK.
5.p ÒӇ đóng hӝp thoҥi mà không xóa bҩt cӭ thông tin nào, click Cancel.
rӝt site hoàn toàn bӏ xóa sӁ không thӇ phc hӗi tr lҥi.
NӃu ta loҥi bӓ thông tin FrontPage ra khӓi mӝt site, thì nó có thӇ đưӧc tҥo lҥi
sau đó: trên menu hӋ thӕng chӑn File â Open, và sau đó sӱ dng hӝp thoҥi Open
đӇ tìm và chӑn thư mc chính cӫa site.
FrontPage hӓi ta có muӕn chuyӇn đәi thư mc này thành mӝt Web site hay
không ± clikc Yes. Sau đó FrontPage sӁ tҥo thông tin nó cҫn đӇ quҧn lý site.
Rác file và thư mөc ҭn
NӃu ta m mӝt thư mc cӫa mӝt Web site bên ngoài FrontPage, ta sӁ nhìn
thҩy nó chӭa các thư mc và file không thӇ hiӇn thӏ trong khung nhìn Folders ho c
khung Folders List ± đáng chú ý nhҩt là toàn bӝ mӝt nhóm thư mc có tên _vti_cnf
140
đang đưӧc sӱ dng bi FrontPage làm mӝt phҫn trong các tính năng quҧn lý site
cӫa nó. r c dù các tên cӫa chúng làm cho chúng dưӡng như là các trang Web, đӗ
hӑa và đҥi loҥi như thӃ, nhưng các file chӭa thông tin vӅ các file trong site cӫa ta -
chҷng hҥn như thӡi điӇm sau cùng mà mӝt file c thӇ đ đưӧc chӍnh sӱa. Các file
trong thư mc _vti_cnf cũng đưӧc sӱ dng cho viӋc quҧn lý site.
Nhӳng file này không nên xóa (m c dù FrontPage có thӇ tҥo lҥi chúng nӃu
cҫn thiӃt)
Khi ta xóa thông tin FrontPage đưӧc kӃt hӧp vӟi mӝt site, nhӳng thư mc và
file này là nhӳng gì đưӧc loҥi bӓ.
Sӱ dөng tài liӋu World trên Web
FrontPage đưӧc kӃt nhұp ch t chӁ vӟi các chương trình khác trong bӝ
ricrosoft Office. KӃt quҧ là ta có thӇ dӉ dàng kӃt nhұp dӳ liӋu đưӧc tҥo bҵng mӝt
chương trình vào mӝt chương trình khác.
Ví d, ta có thӇ làm cho các tài liӋu đưӧc tҥo bҵng ricrosoft Word tr thành
mӝt phҫn cӫa Web site. Ta có thӇ thӵc hiӋn điӅu này theo hai cách.
Cách dӉ dàng là nhұp (import) mӝt tài liӋu Word vào trong site cӫa ta và đӇ
nó theo dҥng nó. Nhӳng tham quan đӃn site cӫa ta hӑ có thӇ xem các tài liӋu Word
sӁ có thӇ xem file bҵng cách tҧi nó vӟi Word.
Khi ta đӇ mӝt tài liӋu theo dҥng Word, ta không thӇ hiӋu chӍnh nó vӟi
FrontPage. Thay vào đó, khi ta cӕ m nó theo cách bình thưӡng - bҵng cách
click đúp file trong khung nhìn Folders ho c danh sách Folders ± nó m trong
ricrosoft Word.
Nhӳng ngưӡi dùng sӁ cҧm thҩy thuұn lӧi hơn nhiӅu khi xem thông tin cӫa ta
nӃu nó đưӧc chuyӇn đәi tӯ dҥng tài liӋu Word sang mӝt ho c nhiӅu trang Web.
ÒӇ chuyӇn đәi nӝi dung mӝt tài liӋu Word sang mӝt trang Web:
1.p Nhұp tài liӋu bҵng cách trên menu hӋ thӕng chӑn File â Import, nhưng ta
thưӡng thӵc hiӋn đӕi vӟi bҩt kǤ file.
2.p NӃu ta không làm viӋc trong khung xem Folders, click nút Folder bên
dưӟi cӱa sә hiӋn tҥi.
3.p Click chuӝt phҧi vào tài liӋu trong khung xem Folders, và sau đó chӑn
Open With â FrontPage (Open as HTrL) tӯ menu tҳt vӯa xuҩt hiӋn
(xem hình dưӟi)
141
Hình VIII.27. Hi͏u ch͑nh m͡t tài li͏u Word trong FrontPage
Lҫn đҫu tiên ta thӵc hiӋn điӅu này vӟi mӝt tài liӋu, có thӇ nó không có sҹn
mӝt chuyӇn đәi đӇ hiӇn thӏ file mӝt cách chính xác. rӝt hӝp thoҥi sӁ xuҩt hiӋn hӓi
ta có muӕn cài mӝt bӝ chuyӇn đәi hay không. Bi vì ta đang chuyӇn đәi tài liӋu
thành mӝt trang Web, click No.
Khi ta sӱ dng nó đӇ hiӋu chӍnh mӝt tài liӋu Word, mӝt trang Web mӟi đưӧc
tҥo chӭa các nӝi dung cӫa tài liӋu.
Tài liӋu này có thӇ chӭa nhiӅu đӏnh dҥng ± càng nhiӅu càng tӕt, các lӵa chӑn
font, kiӇu căn chӍnh và style đưӧc sӱ dng trong ricrosoft Word sӁ đưӧc chuyӇn
sang FrontPage.
Sau khi đ chuyӇn đәi, nó có thӇ đưӧc lưu mӝt cách bình thưӡng: Click nút
Save trên thanh công c Standard ho c chӑn File â Save.
VIII.3. Phát triӇn nhanh mӝt site vӟi các template
Khi bҳt đҫu tҥo các Web site riêng cӫa ta bҵng FrontPage 2003, chương trình
dưӡng như khá gây ҩn tưӧng. ViӋc biӃt nơi đӇ bҳt đҫu và nơi đӇ thӵc hiӋn có thӇ là
mӝt công viӋc gây bӕi rӕi khi ta đ chưa bao giӡ sӱ dng phҫn mӅm này.
FrontPage làm cho công viӋc này dӉ quҧn lý hơn thông qua viӋc sӱ dng các
template, các site đưӧc tҥo sҹn mà phҫn mӅm biӃt cách đӇ tӵ tҥo.
142
Các template cho phép ta phát triӇn mӝt site hoàn chӍnh trong mӝt vài phút
và sau đó dành nhӳng nӛ lӵc cӫa ta vào viӋc tҥo tùy biӃn site đó thay vì ta tҥo mӝt
site ngay tӯ đҫu.
Các template tiӃt kiӋm cho ta rҩt nhiӅu thӡi gian khi chúng phù hӧp cho mӝt
dӵ án.
VIII.3.1. Chͥn mͱt template Web site
FrontPage cung cҩp mӝt vài chc template Web site và trang nhҵm giúp ta có
mӝt sӵ khi đҫu dӉ dàng và nhanh chóng. rӛi template là mӝt khung sưӡn mà ta
có thӇ tҥo tùy biӃn bҵng cách thêm và loҥi bӓ text và thӵc hiӋn các thay đәi khác.
Phҫn mӅm chӭa các templage dành cho mӝt sӕ cách phә biӃn nhҩt mà các nhà xuҩt
bҧn sӱ dng Worl Wide Web.
Các template site đưӧc cài sҹn chӭa mӝt site cá nhân, mӝt site công ty, mӝt
trang phҧn hӗi khách hàng và mӝt trang mc lc.
Tҩt cҧ các site FrontPage và các trang Web bҳt đҫu tӯ các template. Các
template sau đây có thӇ đưӧc sӱ dng đӇ bҳt đҫu mӝt site:
Ëp One Page Web Site - rӝt site có mӝt trang trӕng và không có gì khác.
Ëp Personal Web Site - rӝt site có các trang nơi ta có thӇ mô tҧ chính mình,
chia sҿ ҧnh kӻ thuұt sӕ, và viӃt vӅ nhӳng s thích cӫa ta và các Web site mà
ta ưa thích nhҩt.
Ëp Rustomer Support Web Site - rӝt site cho phép mӝt công ty cung cҩp sӵ
hӛ trӧ khách hàng thông qua các trang mô tҧ sҧn phҭm, mӝt diӉn đàn thҧo
luұn, mүu biӇu phҧn hӗi (feedback form), form tìm kiӃm site, và mӝt trang
có các câu hӓi thưӡng g p.
Ëp Pro_ect Web Site - rӝt site dành cho mӝt dӵ án hӧp tác, vӟi các trang
dành cho thông tin thành viên, tình hình dӵ án, mӝt thӡi biӇu, các cuӝc thҧo
luұn nhóm và mӝt nơi lưu trӳ.
Ëp SharePoint Team Site - rӝt site dành cho viӋc cӝng tác cӫa nhóm có mӝt
lӏch, mӝt danh sách tác v, mӝt thư viӋn file, và mӝt danh sách contact.
Cũng có mӝt template Empty Web Site vӕn tҥo mӝt site không chӭa các file.
Nó khác vӟi template One-Page Web Site điӇm nó thiӃu mӝt trang index.htm.
143
VIII.3.2. T̹o mͱt Web site mͳi
Trong bӕn giӡ đҫu, ta đ làm viӋc trên các trang Web mà không đ t chúng
vào các Web site riêng cӫa chúng.
Ta có thӇ dӉ dàng bҳt đҫu mӝt dӵ án Web mӟi bҵng cách tҥo mӝt site mӟi
trưӟc khi bҩt kǤ trang đ đưӧc tҥo. Bi vì tҩt cҧ các site bҳt đҫu tӯ mӝt template, ta
phҧi chӑn mӝt template đӇ bҳt đҫu mӝt dӵ án:
1.p Trên menu hӋ thӕng chӑn File â New. Khung menu m trong FrontPage
nҵm dӑc theo mép phҧi cӫa cӱa sә biên soҥn.
Hình VIII.28. H͡p tho̩i New Location đưͫc s͵ dͭng

đ͋ cho FrontPage bi͇t nơi đ͋ lưu site cͯa ta
2.p Click hyperlink rore Web Site Templates. Hӝp thoҥi Web Site Templates
m ra, liӋt kê các template mà ta có thӇ sӱ dng đӇ tҥo mӝt site mӟi. Nó
cũng liӋt kê các wizard đӇ ta làm viӋc dӉ dàng hơn.
3.p Chӑn template đӇ sӱ dng cho site cӫa ta ± click biӇu tưӧng cӫa nó. TiӃp
theo, ta nên tҥo mӝt thư mc mӟi nơi site sӁ đưӧc lưu trên máy tính cӫa ta.
4.p Click nút Browse. Hӝp thoҥi này đӇ tìm và m thư mc nơi ta sӁ lưu các
Web site cӫa ta.
5.p Sӱ hӝp thoҥi này đӇ tìm và m thư mc nơi ta sӁ lưu các Web site cӫa ta.
144
6.p rӛi site sӁ đưӧc cung cҩp thư mc con riêng cӫa nó: ÒӇ tҥo mӝt thư mc
con, click nút Create New Folder, như đưӧc minh hӑa hình trên. Hӝp
thoҥi New Folder m ra.
7.p Nhұp mӝt tên cho thư mc trong trưӡng Name, và sau đó click nút OK.
Hӝp thoҥi đóng lҥi, đưa ta tr vӅ lҥi hӝp thoҥi New Web Site Location.
8.p Click nút Open. The mc mà ta đ chӑn đưӧc hiӇn thӏ trong trưӡng text
Specify the Location of the New Web Site.
9.p Click OK. FrontPage sӁ tҥo site, lҩp đҫy thư mc các trang Web, hình ҧnh,
và các thư mc con.
VIII.3.3. T̹o tùy bi͗n Web site mͳi cͿa ta
Sau khi mӝt Web site mӟi đưӧc tҥo tӯ mӝt template, ta có thӇ bҳt đҫu thӵc
hiӋn các thay đәi đӇ tҥo tùy biӃn site này.
FrontPage sӁ hiӇn thӏ mӝt site vӯa mӟi tҥo trong khung xem Folders đӇ ta có
thӇ thҩy tҩt cҧ các file mà nó chӭa, như minh hӑa trong hình dưӟi.
Tҩt cҧ các trang Web trong site nҵm trong thư mc chính cӫa nó. Cũng có
mӝt sӕ thư mc con đưӧc sӱ dng bi FrontPage và mӝt vài thư mc con mà ta
muӕn sӱ dng, chҷng hҥn như images (dành cho hình ành), và _private (dành cho
các file mà các site khách tham quan sӁ không thӇ thҩy đưӧc).
Hình VIII.29. Khung nhìn Folders
145
rӝt thư mc con _private cӫa mӝt Web site, thư mc con này ban đҫu rӛng,
có thӇ đưӧc sӱ dng đӇ làm vӏ trí cho các file mà đ đưӧc che giҩu các khách tham
quan đӃn Web site cӫa ta. NӃu ta tҥo mӝt Web site nơi khách tham quan có thӇ
cung cҩp cho ta các đӏa chӍ thư tín cӫa hӑ, thư mc này có thӇ đưӧc sӱ dng làm
mӝt nơi đӇ ngăn ngӯa thông tin này khӓi nhӳng c p mҳt soi mói.
NӃu ta không sӱ dng template Empty Web Site, thì thư mc chính thuӝc site
cӫa ta sӁ chӭa mӝt file đ c biӋt có tên index.htm. Òây là trang chӫ cӫa site ± trang mà
các khách tham quan sӁ thҩy khi hӑ yêu cҫu đӏa chӍ Web chính thuӝc site cӫa ta.
rӝt sӕ template chӭa các thư mc phc v mӝt mc đích riêng cho template
đó. Ví d, template Personal Web Site chӭa mӝt thư mc photogallery đưӧc sӱ
dng cho các trang vӕn hiӇn thӏ các ҧnh kӻ thuұt sӕ. ÒӇ bҳt đҫu làm viӋc trên Web
site mӟi cӫa ta, h y m mӝt trong các trang dành đӇ hiӋu chӍnh: Click đúp vào tên
cӫa trang trong khung nhìn Folders.
Trang m ra trong cӱa sә hiӋu chӍnh, nơi ta có thӇ làm viӋc trên nó, như ta
thưӡng thӵc hiӋn vӟi bҩt kǤ trang khác, h y thӵc hiӋn các thay đәi và lưu nó vӟi
nút Save trên thanh công c Standard.
ÒӇ quay tr vӅ khung nhìn Folders, click tab Web Site nҵm phҫn trên cùng
cӫa cӱa sә biên soҥn.
VIII.3.4. Thêm và lo̹i bͧ các l͵i chú thích
Trên mӛi trang trong các site đưӧc tҥo tӯ mӝt template FrontPage cung cҩp
thông tin hưӟng dүn vӅ mӝt sӕ trang theo dҥng các lӡi chú thích (comment), text
đưӧc hiӇn thӏ bҵng text màu đӓ tía có tӯ ³Comment´.
Các lӡi bình chú đưӧc hiӇn thӏ khi mӝt trang đang hiӋu chӍnh trong
FrontPage nhưng đưӧc che giҩu khi nó hiӇn thӏ trong mӝt trình duyӋt Web. ÒӇ thҩy
đưӧc điӅu này, h y click nút Preview bên dưӟi cӱa sә biên soҥn. Text chú thích
không xuҩt hiӋn trên trang.
ÒӇ hiӋu chӍnh mӝt lӡi chú thích, click đúp nó. rӝt hӝp thoҥi Comment m
ra vӟi lӡi chú thích chúng trong mӝt vùng text. Sau khi thӵc hiӋn các thay đәi, click
OK đӇ lưu chúng.
rӝt lӡi chú thích mӟi có thӇ đưӧc thêm vào mӝt trang Web:
1.p Vӟi trang m ra đӇ hiӋu chӍnh, click vào nơi mà lӡi chú thích đưӧc chèn vào đó.
2.p Trên menu Standard chӑn Insert â Comment đӇ m hӝp thoҥi Comment.
146
3.p Nhұp text chú thích và click OK. Lӡi chú thích sӁ xuҩt hiӋn trên trang
bҵng text màu đӓ tía.
Ta có thӇ xóa các chú thích vào bҩt kǤ lúc nào, thұm chí nӃu chúng là mӝt
phҫn cӫa mӝt template site ho c template trang. Click lӡi chú thích mà ta muӕn xóa
và nhҩn phím Delete.
VIII.3.5. Khai thác template Personal Web Site
Dù sӟm hay muӝn, thì hҫu hӃt các nhà xuҩt bҧn Web đӅu sӁ tҥo các trang
chӫ riêng cho mình, mӝt nơi đӇ làm cho hӑ tr nên nәi tiӃng trên World Wide Web.
Ta có thӇ dӉ dàng tҥo mӝt file tӵ truyӋn cho s thích chuyên môn ho c cá nhân cӫa
ta bҵng cách sӱ dng template Personal Web Site.
Template này gӗm các thành phҫn sau đây:
Ëp Index.htm, trang chӫ cӫa site, cung cҩp mӝt nơi đӇ chào đón các khách
tham quan và tӵ giӟi thiӋu vӅ mình.
Ëp Photo.htm, mӝt trang đӇ chia sҿ các ҧnh kӻ thuұt sӕ ho c các hình ҧnh khác.
Ëp Interest.htm, mӝt nơi tӕt đӇ mô tҧ các s thích cӫa ta và cung cҩp các
hyperlink dүn đӃn các Web site liên quan.
Ëp Favorite.htm, mӝt danh sách các hyperlink dүn đӃn các Web site ưa thích
nhҩt cӫa ta.
Ëp Aboutme.htm, mӝt trang nơi ta có thӇ cung cҩp mӝt bҧn dài hơn vӅ tiӇu sӱ
cӫa ta.
Ëp Feedback.htm, mӝt nơi mà nhӳng khách tham quan đӃn site cӫa ta có thӇ
đӇ lҥi cho ta mӝt thông điӋp.
Tӯng trang này chӭa mӝt thanh liên kӃt (link bar), mӝt hàng gӗm các nút đӗ
hӑa vӕn có thӇ đưӧc click đӇ tham quan phҫn còn lҥi cӫa site.
ÒӇ xem cách hoҥt đӝng cӫa các thanh liên kӃt trên site mӟi cӫa ta, click nút
Preview in Browser trên thanh công c Standard. Site m ra trong trình duyӋt Web
chính cӫa ta.
Trên các trang Web cӫa site mӟi, ta có thӇ thay đәi hҫu hӃt text, các tiêu đӅ
chính và các hyperlink bҵng cách hiӋu chӍnh chúng mӝt cách bình thưӡng.
Các template cũng đ t mӝt sӕ thӭ trên các trang Web vӕn không thӇ đưӧc
hiӋu chӍnh theo cách mà ta mong đӧi: các thanh liên kӃt, các biӇu ngӳ trang vӕn
147
hiӇn thӏ tiêu đӅ cӫa mӝt trang, và các tem thӡi gian (timestamp) vӕn hiӇn thӏ ngày
tháng trên lӏch.
Òây là các thành phҫn Web ± các thành phҫn trang đ c biӋt sӁ đưӧc hӛ trӧ
bi FrontPage nhҵm bә sung chӭc năng vào mӝt site.
VIII.3.6. Thêm mͱt tem th͵i gian vào mͱt trang Web
Trang chính trong template Persional Web Site, index.htm, chӭa mӝt thành
phҫn tem thӡi gian nҵm cuӕi trang, ngay sau text. ³This page last updates´ như
trong ³This page last updated 01/12/2004´.
Thành phҫn tem thӡi gian hiӇn thӏ ngày tháng mà trang Web đ đưӧc hiӋu
chӍnh lҫn sau cùng. Nó tӵ đӝng thay đәi mӛi khi có bҩt kǤ cái gì trên trang bӏ
thay đәi.
Bҵng cách sӱ dng thành phҫn này, ta có thӇ cho phép các khách tham quan
biӃt đưӧc thông tin trên trang hiӋn hành như thӃ nào. Thay vì công viӋc mҩt nhiӅu
thӡi gian cӫa hoҥt đӝng click ngày tháng bҵng tay khi ta hiӋu chӍnh trang, ta có thӇ
đ t mӝt ngày thành phҫn tem thӡi gian lên trên nó.
ÒӇ thêm mӝt tem thӡi gian vào mӝt trang Web, h y thӵc hiӋn các bưӟc sau:
1.p NӃu trang không đưӧc m trong cӱa sә biên soҥn, click đúp lên file cӫa nó
trong khung nhìn Folders.
2.p Click mӝt vӏ trí trên trang nơi mӝt tem thӡi gian có thӇ xuҩt hiӋn.
3.p Trên menu Standard chӑn Insert â Date and Time. Hӝp thoҥi Insert, Date
and Time m ra (xem hình dưӟi).
Hình VIII.30. H͡p tho̩i Date and Time
148
4.p Chӑn mӝt trong các tùy chӑn Display đӇ xác đӏnh nhӳng gì làm cho tem
thӡi gian thay đәi:
Ëp N͇u nó thay đ͝i b̭t cͱ khi nào th͹c hi͏n b̹ng tay m͡t thay đ͝i cho
trang, ch͕n Date This Page Wass Last Editor.
Ëp N͇u nó cũng thay đ͝i khi FrontPage c̵p nh̵t trang vì m͡t lý do nào đó,
ch͕n Date This Page Was Last Automatically Updated.
5.p Trong menu Date Format thҧ xuӕng, chӑn cách mà ngày tháng sӁ xuҩt
hiӋn.
6.p NӃu mӝt thӡi gian cũng đưӧc hiӇn thӏ, trong menu Time format thҧ xuӕng,
thay đәi giá trӏ tӯ (none) sang giá trӏ khác.
7.p Click OK.
Tem thӡi gian xuҩt hiӋn trên trang, trông giӕng như chính ta đ nhұp nó vào.
Sau khi mӝt tem thӡi gian đ đưӧc thêm, đӇ thӵc hiӋn mӝt thay đәi, click đúp
nó trong cӱa sә hiӋu chӍnh, hӝp thoҥi Date and Time m lҥi. Tҩt cҧ các thành phҫn
Web khác đưӧc hiӋu chӍnh theo cùng mӝt cách.
VIII.3.7. Lưu các thay đͭi sang mͱt site
NӃu ta đ tҥo mӝt Web site cá nhân tӯ mӝt template, ta có thӇ làm vӟi nó
bҵng cách hiӋu chӍnh text, tiêu đӅ chính và các hyperlink.
ÒӇ lưu mӝt trang sau khi làm viӋc trên nó, click nút Save trên thanh công c
Standard.
ÒӇ xóa mӝt trang ho c bҩt kǤ file khác, loҥi bӓ nó vĩnh viӉn ra khӓi site, h y
thӵc hiӋn các bưӟc sau đây:
1.p Quay tr vӅ khung nhìn Folders: click tab Web Site nҵm trên cùng cӱa sә
hiӋu chӍnh.
2.p Click phҧi tên file trong khung xem Folder.
3.p Chӑn Delete tӯ menu tҳt
4.p rӝt hӝp thoҥi Confirm Delete hӓi file có nên thӵc sӵ bӏ xóa hay không.
Click Yes đӇ xác đӏnh viӋc xóa ho c No nӃu ta thay đәi ý đӏnh.
Khi ta sҹn sàng xem công viӋc mà ta đ thӵc hiӋn, h y click nút Preview in
Browser trên thanh công c Standard. Site cӫa ta m ra trong mӝt trình duyӋt Web,
và ta có thӇ thưng thӭc nó giӕng như nhӳng ngưӡi khác sӁ tham quan nó ± click
các hyperlink ho c các nút thanh liên kӃt đӇ xem mӛi trang.
149
VIII.4. Tҥo mӝt site vӟi sӵ trӧ giúp cӫa Wizard trong FrontPage 2003
VIII.4.1. Mͷ mͱt wizard t̹o site
NhiӅu phҫn mӅm sӱ dng wizard, các hӝp thoҥi vӕn có làm cho mӝt công
viӋc khó khăn tr nên dӉ dàng bҵng cách phân chia nó thành mӝt loҥt câu hӓi.
FrontPage và các chương trình khác trong bӝ Office đưӧc xác lұp trên mӝt
máy tính thông qua wizard đ đưӧc cài đ t, do đó hình thӭc này sӁ quen thuӝc vӟi ta.
Trong FrontPage, các wizard có thӇ đưӧc xem là các template thông minh.
Chúng có thӇ đưӧc sӱ dng đӇ tҥo các site và các trang Web quá phӭc tҥp đӃn nӛi
không thӇ xӱ lý bҵng mӝt template.
Bҵng cách phân chia mӝt tác v thành mӝt loҥt các bưӟc đơn giҧn hơn, các
wizard giúp ta có thӇ tҥo các Web site phӭc tҥp - chҷng hҥn như mӝt site công ty
chuyên nghiӋp 20 trang ho c site hӛ trӧ khách hàng - bҵng cách trҧ lӡi vài câu hӓi
đơn giҧn.
Hai loҥi wizard có sҹn trong FrontPage: các wizard Web site tҥo toàn bӝ các
site và các wizard mӝt trang.
Các wizard có thӇ đưӧc tҥo khi ta đang tҥo mӝt site mӟi ho c thêm mӝt trang
mӟi vào mӝt site hiӋn hành.
ÒӇ gӑi ra mӝt site wizard, h y thӵc hiӋn các bưӟc sau:
1.p Trên menu Standard chӑn File â New. Khung New m ra ( phía bên
phҧi cӱa sә - xem hình vӁ dưӟi)
150
Hình VIII.31. Khung New
2.p Click hyperlink rore Web Site Templates. Hӝp thoҥi Web Site Templates
m ra vӟi tab General nҵm trên cùng. Ta có thӇ sӱ dng mӝt sӕ wizard đӇ tҥo
toàn bӝ mӝt site:
Ëp Database Interface Wizard sͅ t̩o m͡t site v͙n có th͋ n͙i k͇t vͣi m͡t cơ
sͧ dͷ li͏u Microsoft Access, hi͋n th͓ các record trên các trang Web và
lưu thông tin đưͫc thu th̵p trên site vào sang cơ sͧ dͷ li͏u.
Ëp Discussion Web Site Wizard t̩o m͡t b̫ng thông báo nơi các khách
tham quan đ͇n site cͯa ta có th͋ giao ti͇p vͣi nhau.
Ëp Corporate Presence Wizard sao chép m͡t Web site hi͏n có sang máy
tính cͯa ta, ngay c̫ n͇u nó không đưͫc t̩o b̹ng FrontPage.
3.p ÒӇ khi đӝng mӝt wizard, chӑn nó và click nút OK. Hӝp thoҥi chính cӫa
wizard xuҩt hiӋn.
4.p ÒӇ sӱ dng wizard, trҧ lӡi tӯng câu hӓi mà nó đ t ra sau đó click Next đӇ
xem câu hӓi tiӃp theo. Khi ta tiӃn đӃn câu hӓi sau cùng, mӝt nút Finish hiӇn
thӏ thay cho nút Next.
5.p Khi ta sҹn sàng hoàn tҩt nhӳng tùy chӑn mà ta đ chӑn trong wizard, click
Finish.
151
VIII.4.2. Nhͅp mͱt site hi͟n có vào FrontPage
NӃu ta đ tҥo các Web site bҵng phҫn khác trưӟc khi sӱ dng FrontPage, thì
ta nên quan tâm đӃn Import Web Site Wizard, vӕn có thӇ đưӧc sӱ dng đӇ đưa mӝt
site và tҩt cҧ file cӫa nó vào trong FrontPage đӇ hiӋu chӍnh.
Vӟi wizard này, ta có thӇ tұn dng các tính năng cӫa FrontPage trên mӝt site
mà ban đҫu không đưӧc tҥo bҵng phҫn mӅm này.
Wizard có thӇ nhұp mӝt site tӯ mӝt thư mc trên máy tính cӫa ta, mӝt thư
mc trên mҥng, ho c mӝt Web site trên Internet.
ÒӇ nhұp mӝt site, h y thӵc hiӋn các bưӟc sau:
1.p Trên menu Standard chӑn File â New đӇ m khung New.
2.p Click hyperlink rore Web site Templates. Hӝp thoҥi Site Templates m ra,
liӋt kê tҩt cҧ các site wizard mà ta có thӇ chӑn.
3.p Chӑn biӇu tưӧng Import Web Site Wizard. Trong hӝp danh sách Specify the
Location of the New Web Site, FrontPage chӑn mӝt tên cho mӝt thư mc
mӟi nơi các file cӫa site sӁ đưӧc lưu trӳ.
4.p ÒӇ chӑn mӝt thư mc khác, click nút Browse. Hӝp thoҥi New Web Site
Location sӁ xuҩt hiӋn. Sӱ dng hӝp thoҥi này đӇ tìm kiӃm và m thư mc nơi
ta sӁ lưu trӳ các Web site mà ta sӁ làm viӋc trên đó bҵng FrontPage.
5.p rӛi site FrontPage phҧi đưӧc cung cҩp thư mc riêng cӫa nó. ÒӇ tҥo mӝt thư
mc cho site đưӧc nhұp vào này, click nút Create New Folder. Hӝp thoҥi
New Folder xuҩt hiӋn.
6.p Cho thư mc mӝt tên trong Name và click OK.
7.p Trong hӝp thoҥi New Web Site Location, click nút Open. Thư mc đưӧc liӋt
kê trong hӝp thoҥi danh sách Specify the Location of the New Website trong
Import Web Wizard.
8.p Click OK. Import Web Wizard m ra.
VIII.4.3. Chͥn mͱt phương pháp import
Câu hӓi đҫu tiên đưӧc hӓi bi Import Web Site Wizard là cách đӇ truy tìm
site, như đưӧc trình bày hình dưӟi
152
Hình VIII.32. Import Web Site Wizard
rӝt site có thӇ đưӧc nhұp theo năm cách, ph thuӝc vào vӏ trí cӫa nó và kiӇu
truy cұp nào mà ta có đӕi vӟi vӏ trí đó:
Ëp FrontPage Server Extensions ho̿c SharePoint Servicess, m͡t kͿ thu̵t
hi͏u qu̫ đòi h͗i m͡t Web server đưͫc trang b͓ vͣi m͡t trong nhͷng tính
năng này.
Ëp FPT (File Transfer Protocol), cách ph͝ bi͇n nh̭t mà các file đưͫc trao
đ͝i trên Internet.
Ëp HTTP (HyperTExxt Transfer Protocol), m͡t cách đ͋ truy tìm các trang
Web và các file khác v͙n có th͋ truy xṷt trên m͡t m̩ng cͭc b͡.
Ëp WebDAV, m͡t h͏ th͙ng t̩o n͡i dung Web ít ph͝ bi͇n hơn các phương
pháp khác.
Cách tӕt nhҩt đӇ nhұp mӝt site là sӱ dng FrontPage Server Extensions ho c
SharePoint Services bi vì điӅu này có thӇ truy tìm các trang và các file khác đưӧc
đưa vào mӝt Web site ngay cҧ nӃu chúng không đưӧc trình bày trӵc tiӃp cho các
khách tham quan.
Khi ta sӱ dng FrontPage đӇ tҥo mӝt Web site, nó sӁ làm viӋc vӟi nhiӅu file
hұu cҧnh trong suӕt quá trình chuҭn bӏ mӝt trang. Ví d, nӃu site cӫa ta sӱ dng
mӝt theme, sӁ có hơn hai chc file đӗ hӑa và các thư mc con cӫa nó. Nhӳng file
này không bao giӡ đưӧc biӇu diӉn trӵc tiӃp cho nhӳng ngưӡi tham quan site cӫa ta.
153
Thay vào đó, chúng đưӧc sӱ dng bi FrontPage đӇ tҥo các nút hover, đӗ hӑa và
đӏnh dҥng các trang.
Bҵng cách sӱ dng các server extension ho c SharePoint Servicers, wizard
cũng có thӇ nhұp các site con (subsite) ± các Web site đưӧc chӭa bên trong các thư
mc cӫa mӝt site khác. (Ví d, mӝt Web site trong thư mc C:\My
Sites\Sports\baseball).
NӃu site đӇ nhұp nҵm trên mӝt phҫn m rӝng Web server ho c SharePoint, ta
có thӇ sӱ dng chúng đӇ nhұp Web site này và toàn bӝ site con cӫa nó:
1.p Chӑn FrontPage Server Extensions ho c SharePoint Services.
2.p Nhұp đӏa chӍ Web cӫa trang chӫ Web thuӝc site vào trong trưӡng text
Web Site Location.
ÒӇ đưa vào các site con, chӑn hӝp kiӇm Include Subsites.
NӃu site mà ta muӕn nhұp nҵm trên máy tính cӫa ta (ho c trong mӝt thư mc
máy tính khác trên mҥng cӫa ta), ta có thӇ sao chép nó tӯ thư mc đó:
1.p Chӑn tùy chӑn File System và click đúp Browse. Hӝp thoҥi New Publish
Location xuҩt hiӋn. Sӱ dng hӝp thoҥi này đӇ tìm và chӑn thư mc chính
cӫa Web site (thư mc nơi trang chӫ cӫa nó đưӧc lưu trӳ).
2.p Chӑn thư mc và click Open. Thư mc đưӧc hiӇn thӏ trong trưӡng text
Web Site Location.
3.p ÒӇ nhұp các site con cùng mӝt lúc (nӃu có), chӑn hӝp kiӇm Include
Subsites.
NӃu site nҵm trên mӝt Web server mà ta có thӇ truy cұp bҵng cách sӱ dng
File Transfer Protocol (FTP), mӝt tiêu chuҭn chung cho viӋc trao đәi các file vӟi
mӝt Internet server, ta có thӇ sӱ dng FTP account cӫa ta đӇ nhұp site. Sau đây là
cách thӵc hiӋn:
1.p Chӑn FTP.
2.p Trong trưӡng text Web Site Location, nhұp đӏa chӍ cӫa FTP server. Bi vì
nó đang sӱ dng FTP, đӏa chӍ sӁ có ftp:// đӭng trưӟc thay vì http://
3.p Trong trưӡng Root Directory, gõ nhұp vӏ trí và tên cӫa thư mc mà ta chӭa
trang chӫ cӫa site.
154
4.p NӃu server đòi hӓi Passive FTP, click hӝp kiӇm Use Passive FTP.
NӃu ta không thӇ tұn dng các phҫn m rӝng ho c SharePoint, thì FTP là lӵa
chӑn tӕt nhҩt trong các tùy chӑn còn lҥi.
NӃu site nҵm trên mӝt Web server mà không đưӧc trang bӏ các phҫn m rӝng
ho c SharePoint (ho c nӃu ta không biӃt), ta có thӇ lưu các file bҵng viӋc truy tìm
chúng tӯ Web bҵng cách sӱ dng HTTP.
Tùy chӑn HTTP không hiӋu quҧ bҵng các phҫn m rӝng, SharePoint, ho c
FTP - chӍ lҩy các trang đưӧc liên kӃt công cӝng tӯ trang chӫ. Nó cũng bӓ qua các
file đưӧc sӱ dng đӇ tҥo các trang đó, chҷng hҥn như các theme FrontPage và
nhӳng file khác vӕn đưӧc sӱ dng đӇ tҥo site.
Tuy nhiên, biӋn pháp sau cùng là HTTP có thӇ đưӧc sӱ dng đӇ nhұp site:
1.p Chӑn HTTP.
2.p Nhұp đӏa chӍ Web cӫa trang chӫ thuӝc site trong trưӡng text Web Site
Location. FrontPage tӹ mӍ vӅ đӏa chӍ: Thay vì sӱ dng mӝt đӏa chӍ chính
chҷng hҥn như www.example.com, nó c thӇ hơn và cũng tham chiӃu tên
cӫa trang chӫ (nói cách khác, mӝt đӏa chӍ nào như
www.example.com/index.html).
3.p Sau khi chӑn mӝt trong nhӳng phương pháp import, click Next đӇ tiӃp tc.
Wizard đưӧc cұp nhұt đӇ phҧn ҧnh sӵ lӵa chӑn cӫa ta.
4.p NӃu ta đang nhұp mӝt site tӯ mӝt vӏ trí đưӧc bҧo vӋ bi password, mӝt
hӝp thoҥi Name and Password Required m ra. Sӱ dng các trưӡng Name
và Pasword đӇ cung cҩp thông tin đăng nhұp cӫa ta, và sau đó click OK.
Sau khi chӑn mӝt phương pháp nhұp, click Next.
VIII.4.4. Chͥn vͣ trí đ͛ lưu site
Câu hӓi kӃ tiӃp mà wizard có thӇ đ t ra là nơi đӇ lưu site. Bi vì ta đ chӑn
mӝt thư mc, nó xuҩt hiӋn trong trưӡng text trưӡng Local Copy Location, trưӡng
này đưӧc tҳt đӇ ta không thӇ thay đәi nó.
Tuy nhiên, có mӝt cách đӇ thay đәi mӝt thӵc hiӋn mӝt thay đәi nӃu ta thay
đәi ý đӏnh và chӑn mӝt thư mc khác:
1.p Hӫy chӑn hӝp kiӇm Add to Current Web Site. Trưӡng Location Copy
Location và nút Browse tr nên đưӧc chӑn.
155
2.p Click nút Browse. Hӝp thoҥi New Page Location xuҩt hiӋn. Sӱ dng hӝp
thoҥi này đӇ chӑn (ho c tҥo) mӝt thư mc mӟi nơi mà các file cӫa site sӁ
đưӧc lưu.
3.p Chӑn thư mc và click Open. Hӝp thoҥi đóng lҥi, đưa ta tr vӅ wizard.
4.p Chӑn hӝp Add to Current Web Site. Click Next đӇ đi đӃn câu hӓi kӃ tiӃp.
VIII.4.5. Thu thͅp thông tin ph̻n hͫi t΃ các khách tham quan Web site
cͿa ta
rӝt trong nhӳng form dӉ nhҩt đӇ tҥo là mӝt trang phҧn hӗi - mӝt vӏ trí
trong site cӫa ta nơi nhӳng khách tham quan có thӇ gӱi cho ta mӝt lӡi nhұn xét
góp ý riêng tư. ÒiӅu này cung cҩp mӝt dӏch v tiӋn lӧi cho nhӳng khách tham
quan cӫa ta và có mӝt ưu điӇm thư hai ± nó cho phép ta bӓ qua đӏa chӍ email
cӫa ta tӯ site cӫa ta.
Tҥi sao điӅu này lҥi hӳu dng? Khi ta bҳt đҫu xuҩt Web, bҩt kǤ đӏa chӍ email
mà ta đ t trên mӝt trang sӁ nhanh chóng đưӧc phát hiӋn bi các spammer - nhӳng
ngưӡi tiӃp thӏ email tҥp nhҥp lҳp đҫy các inbox bҵng nhӳng lӡi đӅ nghӏ mang tính
thương mҥi không cҫn thiӃt.
ÒӇ tìm các đӏa chӍ đӇ thêm vào các danh sách thư tín cӫa hӑ, cá spammer
thưӡng xuyên sӱ dng phҫn mӅm đӇ truy tìm các trang trên World Wide Web. ÒiӅu
mà ta chҳc chҳn không thӇ tránh khӓi là site cӫa ta sӁ đưӧc tìm thҩy nhanh chóng
bi nhӳng chương trình này - thưӡng là trong mӝt thӡi gian ngҳn tӯ mӝt đӃn hai
tuҫn.
Bҵng cách đ t mӝt trang phҧn hӗi thay vì đӏa chӍ cӫa ta trên site cӫa ta, ta sӁ
giҧm đi lưӧng spam mà ta nhұn đưӧc.
ÒӇ thêm mӝt trang phҧn hӗi vào site cӫa ta, h y thӵc hiӋn các bưӟc sau:
1.p r site (nӃu nó chưa đưӧc m) và trên menu Standard chӑn File â New.
Khung New m nҵm dӑc theo cӱa sә biên soҥn.
2.p Click hyperlink rore Page Templates. Hӝp thoҥi Page Templates m ra,
hiӇn thӏ các trang mà ta có thӇ tҥo bҵng cách sӱ dng các template ho c
wizard.
3.p Chӑn biӇu tưӧng Feedback Form và click OK. rӝt trang phҧn hӗi tҥo sӱ
dng các màu, text và nӅn giӕng vӟi phҫn còn lҥi cӫa site. Nó m trong
cӱa sә biên soҥn. rӝt đưӡng chҩm chҩm biӇu thӏ các đưӡng viӅn cӫa form.
rӛi phҫn cӫa form phҧi đưӧc đ t trong đưӡng biên soҥn này. Ӣ đҫu trang,
156
mӝt đoҥn đưӧc tô màu đӓ tía mô tҧ form và cung cҩp mӝt sӕ thông tin
hưӟng dүn vӅ cách nó đưӧc sӱ dng. Text này là mӝt lӡi bình chú, text
giҧi thích xuҩt hiӋn chӍ trong cӱa sә biên soҥn cӫa FrontPage chӭ không
phҧi khi mӝt trang đưӧc xem trong mӝt trình duyӋt Web. (ÒӇ kiӇm tra
điӅu này, click nút Preview ben dưӟi cӱa sә biên soҥn).
Hình VIII.33. Hi͏u ch͑nh m͡t trang ph̫n h͛i

4.p ÒӇ xóa lӡi chú thích, click nó mӝt lҫn và nhҩn phím Delete.
5.p NӃu ta muӕn thay đәi cách diӉn đҥt cӫa mӝt câu hӓi, hiӋu chӍnh nó như ta
thưӡng thӵc hiӋn đӕi vӟi bҩt kǤ text khác trong FrontPage: Nhҩp con trӓ
trên trưӡng và sӱ dng bàn phím đӇ thêm ho c loҥi bӓ các thông tin.
6.p ViӋc đӏnh vӏ và đӏnh dҥng các thành phҫn khác nhau cӫa form cũng có thӇ
đưӧc thay đәi giӕng như bҩt kǤ phҫn khác cӫa mӝt trang Web.
7.p ÒӇ xóa bҩt kǤ phҫn cӫa form, kéo chuӝt lên trên nó và nhҩn phím Delete
Khi mӝt trang phҧn hӗi đưӧc tҥo ra, FrontPage xác lұp nó đӇ lưu các câu trҧ
lӡi sang file feedback.txt trong thư mc _private cӫa Web site.
157
ÒӇ thӵc thi điӅu này, ta phҧi xuҩt site cӫa ta lên mӝt Web server đưӧc trang bӏ
bҵng FrontPage Server Extensions ho c SharePoint Servers, nhӳng cҧi tiӃn nhҵm
giúp nhӳng ngưӡi sӱ dng FrontPage thêm các tính năng đ c biӋt (giӕng như vұy)
vào các site cӫa hӑ.
Vào thӡi điӇm này, ta có thӇ thay đәi cách thông tin phҧn hӗi cӫa khách tham
quan đưӧc lưu như thӃ nào. Nó có thӇ đưӧc lưu sang mӝt file theo nhiӅu dҥng khác
nhau ho c gӱi đӃn ta bҵng mӝt email.
VIII.4.6. Lưu thông tin ph̻n hͫi cͿa khách tham quan sang mͱt file
Nhӳng câu trҧ lӡi đưӧc thu thұp trên mӝt form có thӇ đưӧc lưu trӳ trong mӝt
file trên Web server cӫa ta theo ba dҥng khác nhau:
-p Text - Dҥng này có thӇ đưӧc xem trong mӝt bӝ biên soҥn text ho c đưӧc tҧi
trong mӝt chương trình cơ s dӳ liӋu và trang bҧng tính, chҷng hҥn như
ricrosoft Acccess và ricrosoft Excel.
-p HTML - Dҥng này có thӇ đưӧc đӑc bҵng mӝt trình duyӋt.
-p qML ± Òây là mӝt dҥng phә biӃn cho dӳ liӋu đưӧc tích hӧp rӝng r i vào
FrontPage 2003 và các chương trình còn lҥi cӫa bӝ Office.
ÒӇ lưu thông tin phҧn hӗi sang mӝt file, h y thӵc hiӋn nhӳng bưӟc sau đây:
1.p Click phҧi bҩt cӭ nơi nào trong các đưӡng viӅn cӫa form - đưӡng chҩm
chҩm đưӧc minh hӑa ban đҫu hình trên.
2.p Chӑn Form Properties tӯ menu ngӳ cҧnh. Hӝp thoҥi Properties xuҩt hiӋn
như đưӧc minh hӑa trong hình dưӟi.
158
Hình VIII.34. Ch͕n cách lưu thông tin ph̫n h͛i cͯa khách
3.p Thông tin phҧn hӗi cӫa khách tham quan sӁ đưӧc lưu dưӟi dҥng text. ÒӇ
chӑn mӝt dҥng khác, click nút Options. Hӝp thoҥi Saving Results xuҩt hiӋn.
4.p Sӱ dng hӝp File Format xә xuӕng đӇ chӑn mӝt dҥng cho thông tin phҧn
hӗi:
Ëp Đ͋ giúp ta đ͕c d͍ dàng vͣi Microsoft Excel và nhͷng chương trình cơ
sͧ dͷ li͏u khác, hãy ch͕n Text Data-base Using Comma as a
Separator. Đi͉u này t̩o m͡t file text vͣi ph̯n mͧ r͡ng tên file.csv.
Ëp Đ͋ đ͕c nó b̹ng m͡t trình duy͏t Web, m͡t l͹a ch͕n t͙t là HTML ho̿c
Formatted Text Within HTML. Đi͉u này t̩o ra m͡t file.html v͙n s͵
dͭng cùng m͡t đ͓nh d̩ng vͣi các trang Web mà ta t̩o b̹ng
ForntPage.
Ëp Đ͋ lưu theo d̩ng XML, ch͕n XML. Đi͉u này t̩o ra m͡t file.xml.
5.p Click OK.
6.p ÒӇ chӑn thư mc nơi file sӁ đưӧc lưu trӳ đó, click nút Browse. Hӝp
thoҥi Current Web site xuҩt hiӋn. Sӱ dng hӝp thoҥi này đӇ chӑn mӝt
trong nhӳng thư mc trên site cӫa ta.
7.p Click OK đӇ đóng hӝp thoҥi Form Properties.
Form sӁ đưӧc xác lұp đӇ lưu trӳ các thông điӋp phҧn hӗi trong mӝt file đưӧc
chӍ đӏnh. NӃu file này không hiӋn hӳu khi mӝt ngưӡi nào đó sӱ dng form phҧn hӗi
sӁ đưӧc tҥo ra.
159
VIII.4.7. Nhͅn thông tin ph̻n hͫi cͿa khách tham quan b͉ng email
Thông tin phҧn hӗi cũng có thӇ đưӧc gӱi đӃn ta bҵng email thay vì đưӧc lưu
trong mӝt site cӫa ta.
Khi nó đưӧc gӱi đӃn, nó trông giӕng như sau:
Message Type: Suggestion
Subject: Web Site
Username: Sam Snett
UserEmail: snett@samspublishing.com
ContractRequested: ContacRequested
Date: 22 Aug 2003
Time: 2 : 9:30
Comments:
In this thing on?
Trong email, các câu trҧ lӡi khác nhau trên form phҧn hӗi đưӧc hiӇn thӏ trên
các dòng riêng biӋt. Trong ví d này, Sam Snett vӟi đӏa chӍ email
snett@samspublishing.com đ gӱi mӝt đӅ nghӏ vӟi chӫ đӅ ³Web Site´. rail
hiӇn thӏ cuӕi. Sam đ t câu hӓi, ³Is this thing on?´
Thư phҧn hӗi bҳt nguӗn tӯ mӝt đӏa chӍ tӵ đӝng trҧ lӡi đưӧc thiӃt lұp bi Web
host cӫa ta - ta có thӇ thay đәi đӏa chӍ này thành đӏa chӍ cӫa ngưӡi đang liên lҥc vӟi
ta như mӝt mô tҧ phҫn kӃ tiӃp.
ÒӇ gӱi các trҧ lӡi phҧn hӗi đӃn mӝt đӏa chӍ email, h y thӵc hiӋn các bưӟc sau:
1.p Click chuӝt phҧi bҩt cӭ nơi nào trong form và chӑn Form Properties tӯ
menu tҳt vӯa xuҩt hiӋn. Hӝp thoҥi Form Properties m ra.
2.p Nhұp mӝt đӏa chӍ email trong trưӡng text E-mail Address. Òӏa chӍ này
phҧi là đӏa chӍ email cӫa ta ho c đӏa chӍ cӫa mӝt ngưӡi đang trҧ lӡi thư
cho site cӫa ta.
3.p Xóa bҩt kǤ text trong hӝp Filename. Thông tin phҧn hӗi sӁ đưӧc gӱi bҵng
thư bҵng cách sӱ dng dҥng cӫa ví d SamSnett. ÒӇ chӑn mӝt dҥng khác,
click nút Options. Hӝp thoҥi Saving Result xuҩt hiӋn.
4.p Click tab Email Result đӇ đưa nó lên phía trưӟc.
5.p Chӑn mӝt dҥng trong hӝp Email Format thҧ xuӕng. Các tùy chӑn có sҹn
giӕng như cá tùy chӑn dành cho các file. Email phҧn hӗi đưӧc cung cҩp
dòng chӫ đӅ ³Data posted to form 1´, theo sau là đӏa chӍ Web cӫa trang
phҧn hӗi.
160
6.p ÒӇ xác lұp mӝt dòng chӫ đӅ khác và giúp dӉ dàng tìm nhӳng email này,
h y gõ nhұp nó trong trưӡng text Subject Line.
7.p ÒӇ tұn dng đӏa chӍ email cӫa ngưӡi đ điӅn đҫy đӫ thông tin vào form,
nhұp text UserEmail trong trưӡng text Reply-To Line và chӑn hӝp kiӇm
Form Field Name nҵm ngay kӃ bên nó (xem hình dưӟi).
Hình VIII.35. H͡p tho̩i Saving Result

Click OK đӇ đóng hӝp thoҥi Saving Results, và sau đó click OK đӇ đóng hӝp
thoҥi Form Properties.
Khi lưu kӃt quҧ cӫa mӝt form dưӟi dҥng email, FrontPage có thӇ hiӇn thӏ mӝt
hӝp thoҥi chӍ đӏnh rҵng form không thӇ gӱi kӃt quҧ bҵng email và hӓi xem đӏa chӍ
email có nên đưӧc loҥi bӓ hay không.
NӃu ta biӃt rҵng Web server cӫa ta cung cҩp các server Extensions ho c
SharePoint, h y click No đӇ giӳ lҥi đӏa chӍ email và bӓ qua lӡi cҧnh báo. Sau khi ta
xuҩt trang phҧn hӗi, nó sӁ hoҥt đӝng mӝt cách chính xác.
?ài tұp
1.p Thay vì tӵ viӃt các thҿ HTrL, h y dùng công c FrontPage đӇ tҥo tҩt cҧ các
trang Web cho các bài tұp nhӳng chương trưӟc.
161
BҦNG RÁR TӮ VIӂT TҲT
Browser: trình duyӋt là chương trình đӑc nӝi dung cӫa file XrL và hiӇn thӏ
thông tin cӫa file lên trên màn hình.
Rascading Style Sheets: mӝt ngôn ngӳ khai báo cách hiӇn thӏ các phҫn tӱ
trong file XrL.
Style sheet: là cách gӑi tҳt cӫa Cascading Style Sheets nhưng nó ám chӍ đӃn
mӝt file chӭa các khai báo style.7
HTML: Hyper Text rarkup Language.
WWW: World Wide Web
Markup: Òánh dҩu
Language: Ngôn ngӳ
Text: Văn bҧn
Rect: Hình chӳ nhұt
Rircle: Hình tròn
Polygon: Hình tam giác
Transparency: Òӝ trong suӕt
162
TÀI LIӊU THAM KHҦO
[1] 24 bài tӵ hӑc thiӃt kӃ Web vӟi Front Page 2003, Thuұn Thành, NXB Thanh
niên.
[2] HTrL, DHTrL and JavaScript, Aptech WorldWide¶s book.
163

HTML 2006 Jan 20

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

HTML 2006 Jan 20

Uploaded by

Copyright:

Available Formats

ӪY BAN NHÂN DÂN THÀNH PHӔ HÀ NӜI

SӢ BƯU CHÍNH VIӈN THÔNG HÀ NӜI

I.1. World Wide Web là gì?

Các đӏnh danh đoҥn (fragment identifiers):

Các URL tương đӕi:

rӝt website là mӝt bó các trang web liên kӃt

Có thӇ tưng tưӧng như mӝt ngӑn núi nhӓ các

Có thӇ minh hoҥ hình ҧnh cӫa mӝt website như

Trang chӫ hay trang chính - 'home page' có thӇ

Vұy home page là trang web mà bӝ duyӋt sӁ m

Ví d, dòng sau đây trong tài liӋu HTrL

< >Tiêu đӃ mӫc </ >

sӁ đưӧc trình duyӋt hiӇn thӏ thành

<KEYWORD>pÒoңn văn bҥn chӍu tác đӛng cөa lӉnh</KEYWORD>

5 ký tӵ đ c biӋt hay dùng

Ví d như tài liӋu HTrL đơn giҧn dưӟi đây:

Có thành ph̯n r͟ng, ch͑ có th̓ mͧ.

II.1. Tҥo tiêu đӅ

Thҿ đӏnh nghĩa có dҥng: < >...</ >

Thҿ đӏnh nghĩa có dҥng: <2>...</2>

Thҿ đӏnh nghĩa có dҥng: <3>...</3>

Thҿ đӏnh nghĩa có dҥng: <>...</>

Thҿ đӏnh nghĩa có dҥng: <>...</>

KӃt quҧ thu đưӧc:

rӝt đoҥn văn bҧn rӛng là mӝt dòng trҳng.

KӃt quҧ thu đưӧc:

e. Căn chính giӳa

KӃt quҧ thu đưӧc:

NguyӇn Văn A Thӥ rèn

g. Trích dүn nguӗn tài liӋu khác

KӃt quҧ thu đưӧc:

Soft you now, the fair Ophelia. Nymph,

but I am not sure.

Ëp Căn lӅ trái: <P AIGN=E¼T>«</P>

Ëp Căn giӳa: <P AIGN=CENTER>«</P>

b. Thuӝc tính Clear cӫa thҿ xuӕng dòng

III.1. Các kiӇu danh sách

KӃt quҧ trҧ vӅ mӝt danh sách sau:

KӃt quҧ trҧ vӅ mӝt danh sách sau:

III.1.2. Danh sách đánh sͩ th΁ tΉ

KӃt quҧ trҧ vӅ mӝt danh sách sau:

Chӳ in thưӡng a,b,c,« (TYPE=a)

Chӳ sӕ La m lӟn I,II,III,« (TYPE=I)

Chӳ sӕ La m nhӓ i, ii, iii,« (TYPE=i)

Sӕ thӭ tӵ 1,2,3,4,« (TYPE= ), đây là lӵa chӑn m c đӏnh

III.1.3. Danh sách các đͣnh nghĩa

KӃt quҧ trҧ vӅ mӝt danh sách sau:

III.1.4. Danh sách phͩi hͻp, lͫng nhau

KӃt quҧ trҧ vӅ:

III.2. ?ҧng biӇu

Òӏnh nghĩa mӝt hàng: <TR>«</TR>

Òӏnh nghĩa mӝt ô: <TD>«</TD>

Ô chӭa tiêu đӅ: <T>«</T>. (=eader)

Òҫu đӅ cӫa bҧng: <CAPTION>«</CAPTION>

KӃt quҧ thu đưӧc bҧng như sau:

Hӑ và tên Lӟp Quê quán

III.2.2. Mͱt sͩ lưu ý v͙ b̻ng

<TD«>«</TD> cũng có thӇ chӭa các thuӝc tính NOWRAP, COSPAN và

KӃt quҧ trҧ vӅ:

Ví d mӝt bҧng có Item 2 (tiêu thӭc 2) chiӃm 2 hàng (dòng):

KӃt quҧ trҧ vӅ:

Ví d mӝt bҧng có Item 1 (tiêu thӭc 2) chiӃm 2 hàng (dòng):

KӃt quҧ trҧ vӅ:

< >Tiêu đӃ mӫc </ >

Thҿ đӏnh nghĩa có dҥng: < >...</ >

Thҿ đӏnh nghĩa có dҥng: <2>...</2>

Thҿ đӏnh nghĩa có dҥng: <3>...</3>

Thҿ đӏnh nghĩa có dҥng: <>...</>

Thҿ đӏnh nghĩa có dҥng: <>...</>

Ëp Căn lӅ trái: <P AIGN=E¼T>«</P>

Ëp Căn giӳa: <P AIGN=CENTER>«</P>

Ô chӭa tiêu đӅ: <T>«</T>. (=eader)

<TD«>«</TD> cũng có thӇ chӭa các thuӝc tính NOWRAP, COSPAN và

<IMB SRC=´face.gif´ WIDT=0 EIGT=0>

AIGN=TOP AIGN=MIDDE AIGN=BOTTOM

Theo chiӅu ngang: AIGN=E¼T, AIGN=RIGT

<A RE¼="UR"> Nhóm tӭ đҩu mӓi liên kӁt</A>

<A RE¼="full UR">... </A>

<A RE¼="path E filename">... </A>

<A RE¼="Tên điӅm đích">

Các màu m c đӏnh là: INK=blue, VINK=purple and AINK=red

<BODY INK="rrggbb" VINK="rrggbb" AINK="rrggbb">

<R SIZE= >

<INPUT TYPE="checkbox" NAME="Tên nhóm nút" VAUE="giá

<INPUT TYPE="IDDEN" NAME="previous-url" VAUE="UR">

Copy đoҥn code này và ghi vӟi tên ³þv þþ´