Gi¸o tr×nh ThiÕt kÕ Web : NguyÔn H÷u TuÊn Email:
[email protected] -0912378211
PhÇn I
Giíi thiÖu ng«n ng÷ Html
I. C¸c thÎ ®Þnh cÊu tróc tµi liÖu
1.1 HTML
CÆp thÎ nµy ®îc sö dông ®Ó x¸c nhËn mét tµi liÖu lµ tµi liÖu HTML, tøc lµ nã cã sö dông
c¸c thÎ HTML ®Ó tr×nh bµy. Toµn bé néi dung cña tµi liÖu ®îc ®Æt gi÷a cÆp thÎ nµy.
Có ph¸p:
... Toµn bé néi cña tµi liÖu ®îc ®Æt ë ®©y
Tr×nh duyÖt sÏ xem c¸c tµi liÖu kh«ng sö dông thÎ nh nh÷ng tÖp tin v¨n b¶n b×nh
thêng.
1.2 HEAD
ThÎ HEAD ®îc dïng ®Ó x¸c ®Þnh phÇn më ®Çu cho tµi liÖu.
Có ph¸p:
... PhÇn më ®Çu (HEADER) cña tµi liÖu ®îc ®Æt ë ®©y
1.3 TITLE
CÆp thÎ nµy chØ cã thÓ sö dông trong phÇn më ®Çu cña tµi liÖu, tøc lµ nã ph¶i n»m trong thÎ
ph¹m vi giíi h¹n bëi cÆp thÎ .
Có ph¸p:
Tiªu ®Ò cña tµi liÖu
1.4 BODY
ThÎ nµy ®îc sö dông ®Ó x¸c ®Þnh phÇn néi dung chÝnh cña tµi liÖu - phÇn th©n (body) cña
tµi liÖu. Trong phÇn th©n cã thÓ chøa c¸c th«ng tin ®Þnh d¹ng nhÊt ®Þnh ®Ó ®Æt ¶nh nÒn cho
tµi liÖu, mµu nÒn, mµu v¨n b¶n siªu liªn kÕt, ®Æt lÒ cho trang tµi liÖu... Nh÷ng th«ng tin nµy
®îc ®Æt ë phÇn tham sè cña thÎ.
.... phÇn néi dung cña tµi liÖu ®îc ®Æt ë ®©y
Có ph¸p:
Gi¸o tr×nh thiÕt kÕ Web
1
Gi¸o tr×nh ThiÕt kÕ Web : NguyÔn H÷u TuÊn Email:
[email protected] -0912378211
Trªn ®©y lµ có ph¸p c¬ b¶n cña thÎ BODY, tuy nhiªn b¾t ®Çu tõ HTML 3.2 th× cã nhiÒu
thuéc tÝnh ®îc sö dông trong thÎ BODY. Sau ®©y lµ c¸c thuéc tÝnh chÝnh:
BACKGROUND=
BGCOLOR=
TEXT=
ALINK=,VLINK=,LINK=
§Æt mét ¶nh nµo ®ã lµm ¶nh nÒn (background) cho
v¨n b¶n. Gi¸ trÞ cña tham sè nµy (phÇn sau dÊu
b»ng) lµ URL cña file ¶nh. NÕu kÝch thíc ¶nh nhá
h¬n cöa sæ tr×nh duyÖt th× toµn bé mµn h×nh cöa sæ
tr×nh duyÖt sÏ ®îc l¸t kÝn b»ng nhiÒu ¶nh.
§Æt mÇu nÒn cho trang khi hiÓn thÞ. NÕu c¶ hai tham
sè BACKGROUND vµ BGCOLOR cïng cã gi¸ trÞ th×
tr×nh duyÖt sÏ hiÓn thÞ mÇu nÒn tríc, sau ®ã míi t¶i
¶nh lªn phÝa trªn.
X¸c ®Þnh mµu ch÷ cña v¨n b¶n, kÓ c¶ c¸c ®Ò môc.
X¸c ®Þnh mµu s¾c cho c¸c siªu liªn kÕt trong v¨n
b¶n. T¬ng øng, alink (active link) lµ liªn kÕt ®ang ®îc
kÝch ho¹t - tøc lµ khi ®· ®îc kÝch chuét lªn; vlink
(visited link) chØ liªn kÕt ®· tõng ®îc kÝch ho¹t;
Nh vËy mét tµi liÖu HTML c¬ b¶n cã cÊu tróc nh sau:
Tiªu ®Ò cña tµi liÖu
... Néi dung cña tµi liÖu
II. C¸c thÎ ®Þnh d¹ng khèi
2.1. thÎ P
ThÎ
®îc sö dông ®Ó ®Þnh d¹ng mét ®o¹n v¨n b¶n.
Có ph¸p:
Néi dung ®o¹n v¨n b¶n
2.2. C¸c thÎ ®Þnh d¹ng ®Ò môc H1/H2/H3/H4/H5/H6
HTML hç trî 6 møc ®Ò môc. Chó ý r»ng ®Ò môc chØ lµ c¸c chØ dÉn ®Þnh d¹ng vÒ mÆt logic,
tøc lµ mçi tr×nh duyÖt sÏ thÓ hiÖn ®Ò môc díi mét khu«n d¹ng thÝch hîp. Cã thÓ ë tr×nh
duyÖt nµy lµ font ch÷ 14 point nhng sang tr×nh duyÖt kh¸c lµ font ch÷ 20 point. §Ò môc cÊp
1 lµ cao nhÊt vµ gi¶m dÇn ®Õn cÊp 6. Th«ng thêng v¨n b¶n ë ®Ò môc cÊp 5 hay cÊp 6 thêng
cã kÝch thíc nhá h¬n v¨n b¶n th«ng thêng.
Díi ®©y lµ c¸c thÎ dïng ®Ó ®Þnh d¹ng v¨n b¶n ë d¹ng ®Ò môc:
...
...
...
...
Gi¸o tr×nh thiÕt kÕ Web
§Þnh d¹ng ®Ò môc cÊp 1
§Þnh d¹ng ®Ò môc cÊp 2
§Þnh d¹ng ®Ò môc cÊp 3
§Þnh d¹ng ®Ò môc cÊp 4
2
Gi¸o tr×nh ThiÕt kÕ Web : NguyÔn H÷u TuÊn Email:
[email protected] -0912378211
...
...
§Þnh d¹ng ®Ò môc cÊp 5
§Þnh d¹ng ®Ò môc cÊp 6
2.3 ThÎ xuèng dßng BR
ThÎ nµy kh«ng cã thÎ kÕt thóc t¬ng øng (), nã cã t¸c dông chuyÓn sang dßng míi.
Lu ý, néi dung v¨n b¶n trong tµi liÖu HTML sÏ ®îc tr×nh duyÖt Web thÓ hiÖn liªn tôc, c¸c
kho¶ng tr¾ng liÒn nhau, c¸c ký tù tab, ký tù xuèng dßng ®Òu ®îc coi nh mét kho¶ng tr¾ng.
§Ó xuèng dßng trong tµi liÖu, b¹n ph¶i sö dông thÎ
2.4 ThÎ PRE
§Ó giíi h¹n ®o¹n v¨n b¶n ®· ®îc ®Þnh d¹ng s½n b¹n cã thÓ sö dông thÎ
. V¨n b¶n ë
gi÷a hai thÎ nµy sÏ ®îc thÓ hiÖn gièng hÖt nh khi chóng ®îc ®¸nh vµo, vÝ dô dÊu xuèng
dßng trong ®o¹n v¨n b¶n giíi h¹n bëi thÎ sÏ cã ý nghÜa chuyÓn sang dßng míi
(tr×nh duyÖt sÏ kh«ng coi chóng nh dÊu c¸ch)
Có ph¸p:
V¨n b¶n ®· ®îc ®Þnh d¹ng
III. C¸c thÎ ®Þnh d¹ng danh s¸ch
3.1. Danh s¸ch th«ng thêng
Có ph¸p:
Cã 4 kiÓu danh s¸ch:
`
Danh s¸ch kh«ng s¾p xÕp ( hay kh«ng ®¸nh sè)
Danh s¸ch cã s¾p xÕp (hay cã ®¸nh sè) < OL>, mçi môc trong da nh s¸ch
®îc s¾p xÕp thø tù.
Danh s¸ch thùc ®¬n
.DOC 
30 
199 
89 
