!"#$#%&'$()#*#)"
+#",#-&".#*#/0(1$"2"333
$ 34"#$#%&'#5##&6#7$8
#&9"0"#+":81$#;<".#
&=#$1'>0"?'@ A4
"#:-$/##0;(B#CD(*4)
+ 2*EFG4,#-"0""#H"".#C(I#C
&.1$##()"J?#1()&$14K+ 2EFGELFG
#CB$ D#M"#%$4$)&$1EFGELFG<N
&'O"##; '? 1"#%$#"#&P(#&.&'O"(
Q()5# ;'>H4K+ 2EFG"#$ELFG<N&'O"#;
4
R1$()<8".# AS"H()"#'>5#<$1
#$$+ 2TUV$$U$(( 8WXYV":XZ8$[ #
3V":3 $\< ]483$ [ ": 3^_833$ `4a#b4a8
c$[$8 F$ Udd YXW8 F$ [<" YXW8 c$[8 [ 8
4e8"#f",g(&'O""0"#C":8##$&M#5",'
'? 1h4h".&(I)#$J"4$".
()#1"#- 1#<$1?#(<333
#=#4U#+#5N&.(#*#i#,(*(<$1
<#$<#$3jY3jkV"0#S"l
"0".&'O"4i"$<$h"l&i();+"#&'O"<m 2
)i4$8"n".#*;+"#"#&9o 1pc".#
<$1Q33$ #3$ [ <8#"0"#<
":5# ;3#'"".<q"#H"4U0";+"#
&.&*=#I"#r"#$#%st"-"0"#C$
#'"l".# A9#O":##""2$$8#)#$1
$8#t"&>(# #<0"#"0"t"#7$V<4R
1"# '?&$1$+ 2o68".#s$"#$8 A
"#)"#786S($uv ##""24K<Nt
&)&'O""###EvG"#$ELvGI&w#5EvGELvG
"J(IL&.":"."#H"?#1&$1",&'O"1"#
'?4
8 $<t#0#'#0"l":(1$"2"8
"l"I#H"1#$#;#>&&0H&'O"#
",(?<#$/05##0&.#'w(##8#5##
&)84e4'@7&.##":&0#<=&
#x4`8`d8]8e&"#f##<
4
)$#&((1#":()Sy-
w#:"#z&*".##;(#5##8.(1
#&'O"8ISy$1#,(*(#(0+#$('@&7"".8
##w;5# ;$"3 $\<#
vY{8#P("#+"#$'@#-(#xQ#,(*(&J";4
'@"n&#"i#*Y*B=D4Rx#
#'?#:":1$()#'>#01&'
##;#4'@"$#'()
&x##'?) |B$;".5D/7#>#*<$?
B;".&}#D4
0"S($#P&'O"<t.~o1&7"
{"#w##"(>4
HTML VÀ THIẾT KẾ WEB
!"#$%&'
( )*+,-."/01234 5"
67,%"."891:
;6."/<*25=>?1@?=A.B."/
,CDE(-!F:
;GE
Chương I: NHỮNG KHÁI NIỆM CƠ SỞ.
Chương II: TRÌNH BÀY TRANG.
Chương III: DANH SÁCH VÀ BẢNG TRONG HTML.
Chương IV: ĐƯA HÌNH ẢNH VÀO TÀI LIỆU HTML.
Chương V: CÁC MỐI LIÊN KẾT SIÊU VĂN BẢN.
Chương VI: BÀY TRÍ NỀN VÀ KHUNG.
Chương VII: BIỂU MẪU STYLE VÀ CASCADING STYLE
SHEET.
Chương VIII: CÔNG CỤ SOẠN THẢO TRỰC QUAN WEB
(Microsoft FrontPage 2003)
H=>;6=<1"-."/012,C7
,%89195I"."8919J:
K+KG-LM+L
M?=H7;LMH7NO7;:
MỤC LỤC
LỜI MỞ ĐẦU
1
CHƯƠNG I. NHỮNG KHÁI NIỆM CƠ SỞ 7
I.1. World Wide Web là gì? 7
I.2. HTML là gì? 11
I.3. Các đặc điểm của siêu văn bản 12
:::HG3P*,A*</,%*<C:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
:::HG3P*,A.-L?,%/$-?::::::::::::::::::::::::::::::::::::::::::::::
:::8919,%?QR+9*9:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
I.4. Soạn thảo văn bản - những vấn đề chung 14
:&::? S7,%?891:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::&
:&::-T7::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::U
:&::-4 !V :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W
:&:&:) ?XQG%3L 7::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
:&:':-*<D7Z79399[::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::\
Bài tập 21
CHƯƠNG II. TRÌNH BÀY TRANG 22
II.1. Tạo tiêu đề 22
II.2. Thẻ trình bày trang 24
:::GTF::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::&
:::- GFQT?]1%!?:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::^
Bài tập 32
CHƯƠNG III. DANH SÁCH VÀ BẢNG TRONG HTML 33
III.1. Các kiểu danh sách 33
:::_-.5-/$::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
:::_-5-/$:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'
:::_--5@J::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W
::&:_-*>*M3S ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::^
III.2. Bảng biểu 39
::: ) ?X:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
:::G3= ,C12:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::&\
:::-,FE(::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::&'
Bài tập 49
CHƯƠNG IV. ĐƯA HÌNH ẢNH VÀO TÀI LIỆU HTML 50
IV.1. Hình ảnh tĩnh 50
:::L*2::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'\
:::T`Oab::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'\
IV.2. Các thuộc tính của thẻ chèn hình ảnh 51
::: GFc:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'
&
::: GF8_7,%7dO7:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'
::: GFcO;::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'
::&: GFecd,%7ecd::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'
Bài tập 54
CHƯƠNG V. CÁC MỐI LIÊN KẾT SIÊU VĂN BẢN 55
V.1. Thẻ neo và mối liên kết 55
::: GF7fdg::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::''
:::."?+%hdi9?3.::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::''
:::H@j !L5::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'U
::&:H@j=05::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'U
::':."Gh9?3.:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'W
V.2. Dùng hình ảnh làm đầu mối liên kết 57
:::!61k]:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'W
:::9*RTcfdc::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'^
V.3. Đưa âm thanh vào tài liệu 59
:::."5"L*l:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'Y
:::+lC::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'Y
V.4. Đưa Video vào tài liệu 60
:&::mL*E9+::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::U\
:&::;XL*,E9+::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::U\
Bài tập 62
CHƯƠNG VI. BÀY TRÍ NỀN VÀ KHUNG 63
VI.1. Màu nền và văn bản 63
:::Hn% C:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::U
:::% 6Q,12:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::U
:::% Q5< 3."R GF;M;,%c;:::::::::::::::U
::&: GF,%% :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::U'
VI.2. Nạp hình ảnh làm nền cho trang văn bản 66
::: GFKcOfop;_:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::UU
:::89??.::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::UW
:::7!.,%+%3L Q]:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::UW
VI.3. Khung – Frames 68
:::??F. ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::UY
:::%*<gfcded::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W
VI.4. Thiết lập Target, thẻ NOFRAME và IFRAME 74
:&::"3P*?9::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W&
:&::T;ogfcde::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W'
:&::;Xq?9RTgfcd::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W'
Bài tập 76
CHƯƠNG VII. BIỂU MẪU STYLE VÀ CASCADING STYLE SHEET 77
VII.1. FORM 77
:::gof3%]r:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::WW
:::-%*<?+gof::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W^
:::F) ?X+gof:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::^^
'
VII.2. Cascading style sheet 91
:::39e!39:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
:::OAL e!39e99:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
:::s,?*e!39e99:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y&
::&: P6e!39e99::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y^
::':-XF?+e!39e99:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
::U:>FQ-e!39e99::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
::W:">*e!39e99,A7:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::\
::^:/$= Q-!39ZE[:::::::::::::::::::::::::::::::::::::::::::::::::::U
CHƯƠNG VIII. CÔNG CỤ SOẠN THẢO TRỰC QUAN WEB
(MICROSOFT FRONTPAGE 2003) 129
VIII.1. Tạo một trang Web 129
:::KV5< DE(g?+9\\:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
:::+G?tG9*39::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::\
:::+,%3= G?A::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::&:+G5C(::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::':q+,%% ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::'
VIII.2. Tổ chức một trang với các liên kết, danh sách và bảng 137
:::G!*9?3.,%+G?891::::::::::::::::::::::::::::::::::::::::::::::::::^
:::+GE-::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::&
:::u/G?,A-12::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::&&
::&:7I@]2?G?891:::::::::::::::::::::::::::::::::::::::::::::::::::::::'
::':+G8919A:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W\
::':-9A::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::W
VIII.3. Phát triển nhanh một site với các template 182
:::G9*398919:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::^
:::+G8919A:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::^
:::+v!1"8919AQ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::^'
::&:,%3+1w-3XF:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::^W
::':-9*399?+3891e9::::::::::::::::::::::::::::::::::::::::::::::::::::::^^
::U:G9,%+G?891::::::::::::::::::::::::::::::::::::::::::::^Y
::W:= -!5uG9::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
VIII.4. Tạo một site với sự trợ giúp của Wizard trong FrontPage 2003 192
:&::xGyz?E+9:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y
:&::;P*G9LB,%+g?+9:::::::::::::::::::::::::::::::::::::::::::::::::::::::Y&
:&::G*=0*-**+?:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::Y'
:&:&:,@?F5I3= 9::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::YY
:&:': P**2St-.-4 8919Q::::::YY
:&:U:= *2SQ.-4 Gq39:::::::::::::::::::::\
:&:W:;P*2SQ.-4 1k93::::::::::::::::::::::\&
Bài tập 207
U
CHƯƠNG I. NHỮNG KHÁI NIỆM CƠ SỞ
I.1. World Wide Web là gì?
8+?3E8E9891Z888[3%G-% !:
888E$?0"5I-% !%!?x{Ev+=
i9%?G?)%
R 0"5nvE5,A,L5@E-% !?
888Z=-pf[
R -+/M5I? !P*A-% !4 888 Z=
7[
R e , 12M 5I E| E% !I 5u 6 - % ! Z=
7[:
-?%1 G610"5=> ?}E=A5l!
OAL ,Cpf
% !{Ev?888h%3L 7M2M,E9+
3*M=0?]MaRBG5@j%BI5=>B1xGpf:
-pf=S*<
R L5nQ-0"Ev5I? !P*% !
R Q-!F3= ?6Zu/[% !
R Q12l% !M=G5=E~
FE(+pfj?}?893f9*+?
pf%!BI5=>5= BG%3L {Ev9++
/7M53= ?+-!
MBI? !P*9+5=
W
E~•
€:-0".-BI)!?+-%3L 71+S
•
€5,A=5LD,%•
€5,Ag:
Hl!3%G,FE(.-,Cpf:FE(%!-jAG*=
Z31+i[Q=Ev
!"#$%&'
()*+,-*./*0*0,12*3()1
-5@E5+Zq?9E9q9?[
Gpf-jA,L5@,@G% !:I %!Q
pf."X,A•
4
€9+ 1xGE) L ."Z3%"0"&x#
#&$1[:FE(M5l!3%Gpf5-E) GB3%9+•
/*/*04/*056
-pf=05
Gpf=05.9+0"5n:H=E~QB
=" AG% !?vG-!=%3L L
:-pf=05BIS-%*<5=E~=05
Z=•::€J3%G/??+) ?X5=>5@J1x5=
E~[M,%BI1+S-E) L 5+:
-pf5=>24 !"5I++%-pfDE(Gpf
:;=G,FE(Q2*-*pf=05M2DXBpf
•
0*0/7
€: pf =0 5
?+5-E) E=A5l!+G3." ,12
`c?9q‚€ **39?:3€be **39?`ƒcb
^
„x?G%pf5<!5Q
•
0*0/7/7*/
€ ?+ .
pf=05?+,L5-E) +G2E=A5l!
(89/0+,0/,+,,1
„ x ?G % pf 5<! 5Q
•
0*00/
€
?+7M-pf5=>Ev5I
R ."A%3L +n% !.-MZi9c,%;[
R ."A.I E1+%+n.@12Z?*[Zi9
:8;<
=38>
[
R OSG2M5=>M+n**39?+G?MZi9
89#
?@2A3#)>>:A8;>B
[
R +G12ES2Zi9
)>)A)
[
R +Gq+?Zi9
C?
[
R +G. %3L Zi9
C)A8C)A
[
R ?FE~GjE~1+%Zi9
D#@:?3<DB?A#8;=
EA:
[
R .2+-4 !=A E63L 2G%3L Zi9
FA)E
[
;%!!=Ev-!F=G(?)6 F5I? !
P*9?9MQ!" 3%].":-%!BI3%-
,12M]2l!5*=0LaA+EL
lL1x,LDE(-.L M1I =>?)>2<,A
-]25=,%j<6+-5025B!
<]."x?=An:
Y
; < DE(-!F5I? !P*9?9]."
%!%C ,%=DE(-!FB?]5G,%"c
5II -1-+Q-!.- :%"%+5I=BI
E|E%DE(-!F5I? !P*9?9=G(*(,(5V
3$+,L?/ ]."??G3A)
+%(:
L%!?xE|E%01x=x ,12Z7!*9?9i[:
e ,123%-,12•€BIX*=5],%
)*+-%3L 34 :;=5.*2)]."
?+.+9?9,P:
-L ,12E+%9E;93+5Ci ),%+
YU'=G=A0Z•+* 9?_?9€[,C.2Q-!F
?+=03:…!,,C--!FB?F L=+=M1"
-? !]-<":
_$-$L ,123%QG.†=?T=c3%
K9?9?h99:e .L*Hoiq+?Zc[YWUM
Y^\5,"G=0?]*w3."C 1).‡
?G5S@=.I 3." ,12:;Y^YM?+.3%,L
L/ .† Pll ˆ Zdf;[K9?9Z(!†[M
)!-5SL*?),),2?+,L?%3L M55=?G5C
-3= ?6 ,12?-!F++E|E%]."%3L 0:
?+"A ,12888M=DE(BIE|E%5
t%3L %!%3L .-4 -3.":;=,P!B
IE 3@?+i3G*+*X?+.,~S%:†
P ,12X*+.*2P ,?0x?%,~B
\
I=‰5=>-.L-G:FB5B**<+?
1=A*-?I1vuQ9?9?+6<5l!:
I.2. HTML là gì?
HI*u1"?+%(M<G6*u1",%E|
I MG.I ,L*u1""Š5T%+%1G--!FBI
I 5=>:;6*u1"Ev1x8+?3E8E98913%7Z7!*9?
9i?. * 9[:
7+-2-J5I
u1"-%3L ?$ !",A-9EM,12M12ME
-M2M::,:,a
? !]?$ !"9+-3." ,121k,L
.F,%+GX
"."-5@E+,L.I+--+E@Z?+[
,A-"1@tiM5,A=Ev?+,L]."M+
-2*‹M5n%M:,:,a
K+S*?9ER99M,E9+3*M+ E3*M,%-/E(?$
"*.-?+-%3L Q:
-?8915<!5G%1)!?8+?3E8E98913%
-? ,125=>,"1k65-E) ,12!
V 4"#$#%11$"0"
#=#O##n##'@?#5##8w(##8
$8"0"(=-&-"0"<#0"444
7 0# S<#0#&u#t""#S
":""2T
!"T":"0"#C&0# SV4
U0"#C0"&x#"0"##H"5#&$1'>H(
#5#4
#$%$&$$"T()'>t#'"0"
P5#8#&>#>4."."u#0"#J"#N&-
"0";##t"#;;"5# !4U0"o#$0".~#M0"&x#
&'O"")&6Y#o#P<m 24K+ 2•$ 8
•
$ <8
444
'()*"T&,'?"#-&5#
t*()4U0"###,#0"#'#5##8
w(##8#$1#5#44&*#€"g($€$()&$1$&.4
+,()-!"T"#$#%-#*
0"#g>Y4.".0" 2"# S<t#H"1":
Y&=?'@<m 24'@ AY".#&7"(
#",-&-&.Q(I&w8#;#=&'O"w t#H"1
#'#-$4#t"<t&i'O$##9#0;(
"9&4
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
&)"P?#,"H#,(*(:G%3L 75=>
,"1kG*<C+2+(I1).‡M?G-!(I%+5B
5C BI55=>?1).]GL=0F%+:
HC %!BJ3%-L* ,12BI5=>?]E !LI
@?c!v!%.*2D6!5u]:I M".
&'O"+#"#S5"0"#C"#f !&1",",#(5"#H
#"2#",(#'#-$4
Œ,]3„5B%1##"#g""#g;<
":1<N#;(#5#"#+#0"#'#-$5"ny#$5#
;##;"0"###,<$:
$#t"!8"#f#t"<t&)"P&=?#,"H8"#'
#$$&)"P&=?#,(*(4j*<3}3% ‹+-M•-
*<x?GE+t%*-?Iil!E$].+%+%=0
F :
I.3.2. Độc lập với khái niệm trang và thứ tự các trang
GF)63%75G3P*,A.-L?:12
5=>?]1%!v!9+.F=AQDuI@Du?G1C
]„ V0MDuŠ*1C]„5=>.Ž+E%?5II@
+"GE :HGE%Q,127$$.1@":
I.3.3. Website và trang chủ - homepage
Gy9193%G1B-?y913."
,A ,%3.",A-?x1+%
k@=L:7%?L 8919
3.",A +%8+?3E8E9891h
888
BI=x=>=GXw-
?y91•%!G+M5=>*-
?I1k-,%+C ?y913X
.-6
BI+]2QGy919=
?+],„1
?Q!?FR•+9*9•BI
I 3%DFR•q?+E++?•5IlP*,%+
.+3."k@)!:
P!+9*93%?y91%1GE !L„x
?5< •.=Ev1V5<
y919:
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
(i6();5##'@6("0"+t
•UYY8".#&'O"1$QS"H5#<$1#$##'@$4
#$/'?"8S""0";(i6":<#".
&4#(#$J"4#(4
‚#5# ;$\<&7"(i68.<N x"#"0"
#C;###x(#5#(0+##5#'@734
&
KP\#61&M"H":(0+#"2")4."0
##;":(i6/;"m~":5# ;4;= %!
„)!M-?]E !L.- BII@vG? S
.+%+% :
.<$1#$<H"1$(i6&u
/&x#&&) ;#&'O"##x&u4
eDE(75I+2+-? ,12M*g"
"l##0"(S<$? A"0")<$1#$##'@:
‘M?++2+,12=M5I3%u1P- 5C
*25-E) B,%‰+MF6:::=0?]+2+
,12„m-E) L F>*Z.])!5=>[,%+5<
,% 5+ 5C5=>5IILB9+! < :
A7Œ=0$=,P!:HI3%u1P- 5C<
5-E) 5I1V5< ,%5I."XQ5+ 5C1kn*T
79EM,FE(
(FG1(FG1
:KGE !L„I@5+%!,A‰6
+0,%F6:
FE(ME• 5l!?+%3L 7
(FG1H7IJ0G(FG1
„5=>?]E !LI@%
Tiêu đề mức 1
7L ! B C ( + 2+ , 12 =
"$<$hc$[8X(344?$ ;t"/t&)
'
<#(i8"#$#%<$1#$<#'<$1#$#
#'@:
!M;"5(#"u#0":8g(~#M":"0"#C
#0"#ƒS",#-&".#1$"0"3&)8'>0"
?'@<m 28H""0"H 23<:
I.4.2. Các thẻ HTML
U0"#C A&0$"#$5# ;"0"##H"5#
(#5##$J" A&"#„()(=-&-"0"#0"M()&$1
"#'>5##0"444
r#C6(()o#$0V
<AKL?E
V$7"?# S€%#>€
E€?#>€G4
,#-"0";###;Q()"J##CT#C(I
(<AKL?E1
#C&.
(<AKL?E1
4XS1"#"#%$
MM
+#;#C&.4;#<N
0"&)$&$1Q(##C4
(<AKL?E1 NO0P7Q0R0ST(<AKL?E1
)<=#C#"."J8"#u&'O"7"0"#C.$##C/04
U#f".#C(I
(<AKL?E1
(#4
#*#C".„("0"#)"+#8""S#("0"#(
<="#-#>"#$;"#t"#;;#4U0"#)"+#&'O""#(#
$1T#)"+#g)"#)"+##g)"#y"#74
)#)"+#g)"-#'#"..#5#C;#(?#t"
#;&'O"4FE(M5ImG]2,%+?%3L EvT
(891
U
Z9[: !M<j?}-2%+„5=>E-,%+5l!:HC %!
5=>"3P*1k GF
=3+MP0U0STM
: GF
ef3%1V1 G*2B5,AT
(891
:
I.4.3. Các quy tắc chung
G5C <3= .+2+ ,121k7
R #* S"0"#*#"l"#f".0" 2#'() S"0"#4
F1#<m 2#C&##;#* Si"0"#*#4
R ksW&= n&'O"(#'() S"0"#8&=
##5"#u#<m 2#C'>H
R U.#-#C##w;"##'@#$4
R K5"0"+t S?#>€
1
€8 S#…#>€
(
€&i&'O" A(
#C&0# S8 $&.&##x"0"+t/&x#"0"#
-T†‡†‡
;B M / g" - "0" + t &J" ; $
ˆ/ˆ&x#":+tQ( S(< V† S"#S(#z‰‡‰
VH5W75PX
'.$5n1L!Ev
K{ tự Cách viết
` ’3“
b ’“
• ’4 +“
$?V ’1*“
W
’ ’*“
BIm-E•1]3 PMXF:::,%+? S1k
-5n6n*E) XF
(Y
,%
1
:?]E !L„1w4 .
iŽ5"*<k6n*E) 5B
(YEZ0[\01
^
I.4.4. Cấu trúc của một tài liệu HTML
7;&*".#"Su"#'<T
(F:1
(FA)E1(8:A1(8:A1(FA)E1
(@?EK1
(@?EK1
(F:1
7!i9?]E !LI@%3L ?="%+:_J3%G
??V=BGE ]2”
k"J#C&*
(8:A1(8:A1
n"#<N#;
##&*":"m<9#5# ;&7";4-…=
#55# ;<N"#$#;;#$&.4
$)) ":;Q(##C0"&x##w":
(@?EK1(@?EK1
4-E•,12M]2MlM,E9+M
-3.":::+?8915C *2kx5l!:
FE(=%3L 7502E=A5l!
(F:1
(FA)E1(8:A13] H7 I(8:A1(FA)E1
(@?EK1
RR^70ST7_`3Q0O
$*ab##^*#0Q0H
cddP \ cQ0# T7 cQ0
(@?EK1
(F:1
Y
7!i9?]E !L?]1%!%3L ?="%+:
;A3?kC E) -j5=>+=GME) i E•j
5=>IL=GE) -%3L ?+%+%=05=0,A%
3L 5l!
(F:1
(FA)E1
(8:A13]H7I(8:A1
(FA)E1
(@?EK1
RR^70ST7_`3Q0O
$*ab##^*#0Q0H
cddP\cQ0#T7cQ0(>1
(@?EK1
(F:1
!M5IE|9+E},%*-L3•M?]1%!=?+
,12?=AEB‘Gtn*TMi E•.<"M5n
-T,%+0>*3):
I.4.5. Các phần tử HTML (HTML element)
);1$o#*###,4)##
#,&'O"&0# SQ()"J#C(I#C&.4
U0"###,".#"Su"#w"S#5#"w8###,
€(}€"#H#*###,€"$€#0"6$.4
U.###,r8"#f".#C(I4
\
R<$1#$;&u"u#08",g("Su"
":o###,4
‚#=#'#P5#8-1(g"r"u#0<N
#".()#0$r$0$"#$-(5# ;<N#,(
5#3##'1(=(#4
Bài tập
: ; -5n5IQ ,12Z7[
: "%+3%?891r
CHƯƠNG II. TRÌNH BÀY TRANG
II.1. Tạo tiêu đề
x5< -?,12=3%- 5C<3%u1Pt
*<Q,12==0M(M:::Œ<B5C(?}?%.-,A
*<l5I=59+E}+ PL:
BU/ 5C?+7:-IL- 5C*( G
,%+?]E !L==]
• 5C/
T5@JBE
(FG1(FG1
FE(
(FG1H7IG(FG1 0H7I&eJ
Tiêu
đề 1
• 5C/
T5@JBE
(F61(F61
FE(
(F61H7I6(F61 0H7I&eJ
Tiêu
đề 2
• 5C/
T5@JBE
(F1(F1
FE(
(F1H7I(F1 0H7I&eJ
Tiêu
đề 3
• 5C/&
T5@JBE
(Ff1(Ff1
FE(
(Ff1H7If(Ff1 0H7I&eJ
Tiêu
đề 4
• 5C/'
T5@JBE
(Fg1(Fg1
FE(
(Fg1H7Ig(Fg1 0H7I&eJ
Tiêu
đề 5
• 5C/U
T5@JBE
(Fh1(Fh1
FE(
(Fh1H7Ih(Fh1 0H7I&eJ
Tiêu
đề 6
II.2. Thẻ trình bày trang
II.2.1. Một số thẻ chính
-%*<?]1%!?5I5@E2G5+,12,%
*2k?+*<lQ%3L :BC T5=>DE(=
?+%3L %!j?]1%!GT?]1%!F5@E*<
5@jZ
()EEA==1
[M5+,12Z
(>1
[Mi E•Z
(@1
[MF
6Z
(3A;A1
[M5=.TZ
(F1
[M5+,1255@E{
Z
(>A1
[M?FE~ S%3L Z
(@:?3<DB?A1
[
a. Định dạng phần địa chỉ
U#$-##'&x"#f8 ##-0"8#'@&JI
&,#"=;4
T5@E
()EEA==1()EEA==1
FE(
()EEA==1
;*/***^(@1
2@(@1
2W70c>/;*&/#27W70c#3iG6f(@1
*jG6kfghlmni
()EEA==1
"4 2 5=>
&
b. Đoạn văn bản
T%!Ev5Ii-5@G5+,12:T
(>1
Z??*[B
IEv.m GF5I)5@-?]1%!5+,12:
j3%AG5+*??*M-1%!?FE+-%*<
.-+%:=jB.+2?.+2GE•!DE•
?=A*??*M?t.k?+*<5@j
()EEA==1()EEA==1
:
G?]E !LILE•5< Q*??*(,%+:
T5@JE
(>1(>1
(>+,*o0**o,1(>1
G5+,12?•3%GE•?V:
]5< E•fZ??9f9 ?[.BL 3$i E•A
%jB-E(=GE) -ME+5BBI+GE•E-
ZGE•?V[6-5+,12<*2DE(T
(>1
:?=
>*%!j<EvT
(>1
503TM.<T5B:
XGT.-=-T 5C
(FG1##(Fh1
ME•.T
(F1
ME-M121I M:::5.m3 ,Li E•%
G5+,12A:<EvT
(>1
?=A,% -T
%!:
c. Xuống dòng
#C A&= n(?4Fg)"= n1x+J
o#.4Xn(?&'O""*#' n&'O"Ct&)# n&.
/0
T5@JE
(@1
'