TRƯỜNG
ĐẠI
HỌC
ĐÀ
LẠT
KHOA
CÔNG
NGHỆ
THÔNG
TIN
Thạc
sỹ
Hoàng
Mạnh
Hùng
BÀI
GIẢNG
TÓM
TẮT
LẬP
TRÌNH
WEB
Dành
cho
sinh
viên
ngành
Cao
Đẳng
(Lưu
hành
nội
bộ)
Đà
Lạt
2008
MỤC
LỤC
M Ụ C
L ỤC
1
CHƯƠNG
1:
GI Ớ I
THI Ệ U
HTML
–
CÁC
SIÊU
LIÊN
K Ế T
4
1.3.1 HTML Development
6
1.3.2 C ấ u trúc c ủ a m ộ t tài li ệu HTML
7
1.3.3 S ử d ụ ng th ẻ <META>
10
1.3.4 S ử d ụ ng ký t ự đặc biệt trong tài li ệu HTML
10
1.4.1 Gi ớ i thiệu siêu liên kết và URL
12
1.4.2 S ử d ụ ng siêu liên kết
14
1.4.3 Đ iều h ướ ng quanh Web site
19
CHƯƠ NG
2:
CÁC
TH Ẻ
HTML
C Ơ
B Ả N
22
! " #$%& #'%
2.6.1 Danh sách không thứ t ự
25
2.6.2 Danh sách có thứ t ự
28
! ! () * #%
+ ,-
. / 0
1 2 3 - /
CHƯƠ NG
3:
S Ử
D Ụ NG
B ẢNG
40
4
5- 63
4
3.2.1 Thẻ dùng để t ạ o b ảng
40
3.2.2 Chèn hàng và c ột
43
3.2.3 Xoá hàng và c ột
44
3.2.4 Tr ộ n ô: kết h ợ p c ộ t hay dòng
45
3.2.5 Đị nh d ạ ng cho ô
48
7 '/- /
4
3.4.1 Chèn ảnh động (.GIF) vào tài li ệu HTML
50
3.4.2 Chèn âm thanh vào tài li ệu HTML
51
3.4.3 Chèn video vào tài li ệu HTML
53
CHƯƠ NG
4:
S Ử
D Ụ NG
BI Ể U
M Ẫ U
VÀ
KHUNG
54
68 9
4.2.1 S ử d ụng biểu m ẫu
54
4.2.2 Phầ n t ử FORM
55
4.2.3 Các ph ầ n t ử nh ậ p c ủ a HTML
56
4.2.4 T ạ o biểu m ẫu
66
,
+:
;< =>?@A BCD
4.3.1 T ạ i sao s ử d ụ ng khung?
70
4.3.2 S ử d ụ ng khung
70
4.3.3 Phầ n t ử IFRAME – Khung trên dòng (inline frame)
76
CHƯƠ NG
5:
S Ử
D Ụ NG
STYLE
78
.1
.1
5.2.1 Gi ớ i thiệu DHTML
78
5.2.2 Các đặc đ iểm c ủ a DHML
79
E
14
5.3.1 Khái niệm, chứ c n ăng và l ợ i ích c ủ a Style Sheets
80
5.3.2 Quy t ắ c Style Sheets
83
5.3.3 Các Selector trong Style Sheets
85
5.3.4 Kết h ợ p, liên kết và chèn m ộ t Style Sheet vào tài li ệu HTML
91
5.3.5 Thiết l ậ p thu ộ c tính trong Style Sheet
93
CHƯƠ NG
6:
JAVASCRIPT,
N Ề N
T ẢNG
VÀ
CÚ
PHÁP
95
+
:
+ ' F'$
:
6.2.1 Javascript là gì?
95
6.2.2 Hiệu ứng và quy t ắ c Javascript
96
6.2.3 Các công c ụ Javascript và IDE, môi tr ườ ng thự c thi
97
6.2.4 Nhúng Javascript vào trang Web
97
6.2.5 Ví d ụ đơ n gi ả n s ử d ụ ng h ộ p thông báo và phươ ng thứ c write
103
+ 6
4
6.3.1 Khai báo biến
104
6.3.2 Ph ạ m vi c ủ a biến
104
+ 8 G
4
Ý ngh ĩa
108
+ -
4:
6.5.1 Toán t ử s ố h ọc
110
6.5.2 Toán t ử so sánh
111
6.5.3 Toán t ử logic
112
6.5.4 Toán t ử chu ỗ i
113
6.5.4 Toán t ử Evaluation
113
6.5.5 M ứ c ư u tiên c ủ a các toán t ử
115
++ 3
+. H
4
+1 'I J$
+: / ,-
CHƯƠ NG
7:
CÁC
ĐỐ I
T ƯỢ NG
C Ơ
B Ả N
TRONG
JAVASCRIPT
129
.
:
. " (K F'$
:
7.2.1 Câu lệnh This
130
7.2.2 Đố i t ượ ng String
132
7.2.3 Đố i t ượ ng Math
134
7.2.4 Đố i t ượ ng Date
137
;< =>?@A BCD
. " (K ' L
. M F'$
. 2 N O M
4
TÀI
LI Ệ U
THAM
KH ẢO
153
;< =>?@A BCD
CHƯƠNG
1:
GIỚI
THIỆU
HTML
–
CÁC
SIÊU
LIÊN
KẾT
P= =AQR RAST@U @VW& DX@ RY =AZ*
[ =\ ]^ @=C>@C=
[ =\ ]^
'_P= `a= =V_ b_cd eT@ U_\@
f gh@U i_jd b_j@ kP= =>l@U =V_ b_cd
f gh@U =Am #%
f gh@U RnR ko =p eqR D_c= =>l@U =V_ b_cd
1.1
GIỚI
THIỆU
r@=C>@C=s&rBl>bg
B_gC
BCDs&
]V
rBCD
<tUCs
kA[@U
RAu
Rv@
bV
RnR
=Ad;=
@Uw
_x
eyW& RnR =Ad;= @Uw @VW ez =>{ =AV@A A_c@ =ApR @=C>@C= bV `X@U `nW =|@A b}
@ @A~= =>j@
=AP U_}_& eS•R €C` @AS bV `X@U R•t RnR `X@U Bl>bg B_gC BCD bV `a= =;
< Rl@ R•t
@=C>@C= Bl>bg B_gC BCD U‚` RnR BCD C>]C>i RY `q= kAƒ< `„_ @T_ =>j
@ =AP U_}_
nR
BCD
iC>]C>
RA…t =A[@U =_@ `V D~=
k†
@USx_
g‡@U
@Vl
=>j@
=AP
U_}_
R
ˆ@U
RY
=AZ
=>dW R;< eS•R nR =A[@U =_@ eY eS•R bSd =>w gS}_ gX@U RnR =>t@U BCD
>l@U <A‰@ @VW& RAQ@U =t iŠ A„R ]^ U[@ @Uw en@A g~d i_jd ]‹@ D\@
& eyW bV
`a= <A‰@ Œdt@ =>„@U =>l@U bz@A ]pR =A_P= kP ]V <An= =>_Z@ =AP U_}_ BCD
1.2
GIỚI
THIỆU
INTERNET
X@U
bV
`a=
@AY`
RnR
`nW
=|@A
kP=
@•_
]}_
@Atd
@=C>@C=
bV
`X@U
R•t
RnR
`X@U
_tl =A…R $Ž$ >t@i`_ii_l@ l@=>lb $>l=lRlbŽ@=C>@C= $>l=lRlb Rd@U R~
< ]_cR kP=
@•_ =~= R\ RnR `nW =|@A =>j@ =AP U_}_
Hình
1.1:
Internet
Bl>bg B_gC BCD bV `a= =;< Rl@ R•t @=C>@C= Y Dƒ= e‰d @AS bV e^ n@ @UA_j
@ R…d R~<
Œd•R U_t =X_ <Av@U @UA_j@ R…d { AhW • UVW @tW& @Y Rd@U R~< =A[
@U =_@ RAl
@USx_ g‡@U =>j@ =lV@ =AP U_}_
BBB
AlX=
ea@U
gpt
=>j@
RT
RAP
eZ
eSt
RnR
=V_
@UdWj@
RY
U_n
=>•
eP@
]}_
@USx_
g‡@U Y bV*
;< =>?@A BCD
_tl =A…R* USx_ g‡@U =dy@ =ACl RnR U_tl =A…R @VW eZ =>dW R;< =V_ @
UdWj@ =>j@
BCD W<C>C€= >t@i‘C> $>l=lRlb$ bV U_tl =A…R eS•R BBB i
f gh@U
•t RAu* BBB =dy@ =ACl `a= RnRA =A…R eq= =j@ =A•@U @A~= eZ =>dW R
;< ]Vl RnR
=V_
@UdWj@
=>j@
BCD
eS•R
if
gh@U
eZ
@A;@
gX@U
RnR
=>t@U
]V
RnR
=V_
@UdWj@ =>j@ BCD
* U[@ @Uw en@A g~d i_jd ]‹@ D\@ eS•R if gh@U eZ
=Xl RnR =V_
b_cd RY =AZ =>dW R;< =>j@ BCD V_ b_cd eS•R =Xl >t D’@U RnR
A if gh@U
RnR =Am ]V RnR <A‰@ =f R•t ,_bC eS•R bSd =>j@ BCD iC>]C> ]}_
ed[_ A=`
AlqR A=`b
A_ DX@ if gh@U =>?@A gdWc= eZ Wjd R‰d `a= i• =A[@U =_@ @Vl eY& BCD iC>
]C> iŠ en<
…@U
RnR
Wjd
R‰d
eY
Y
Uf_
=A[@U
=_@
eS•R
Wjd
R‰d
eP@
=>?@A
gdWc=
gS}_
gX@U
RnR
=>t@U “CD >?@A gdWc= e•@A gX@U =A[@U =_@ gl `nW RA• Uf_ ]^ ]V A_Z@ =A_ RA
Q@U
Hình
1.2:
Trình
duyệt
yêu
cầu
đến
máy
chủ
1.3
GIỚI
THIỆU
HTML
U[@ @Uw en@A g~d i_jd ]‹@ D\@ RAu >” `a= =>t@U BCD eS•R A_Z@ =A• @AS =AP
@Vl =>l@U
`a= =>?@A gdWc= f gh@U RnR =Am ]V RnR <A‰@ =f & DX@ RY =AZ*
_^d kA_Z@ A?@A =A…R ]V @a_ gd@U R•t =>t@U
Nd~= D\@ RnR =V_ b_cd =>pR =dWP@ ]V =>dW €d~= =A[@U =_@ =>pR =dWP@ D’
@U RnRA if
gh@U RnR b_j@ kP= eS•R RA•@ ]Vl =V_ b_cd
Xl RnR D_Zd `–d =>pR =dWP@ eZ =Ad =A;< =A[@U =_@ ]^ @USx_ g‡@U& Œ
d\@ bo RnR
U_tl g•RA
A•@ RnR e•_ =S•@U @AS tdg_l Rb_<& ]_gCl Rb_<& RnR =AV@A <A‰@ R=_]
CN ]V RnR
Ft]t <<bC= ]Vl =V_ b_cd
V_
b_cd
=Xl
=AV@A
`z
@Ud‚@
R•t
=>t@U
BCD
A_
eS•R
€C`
=>j@
=>?@A
ilX@
=A\l& =V_ b_cd @VW bV `a= RAd—_ RnR =Am ]V RnR <A‰@ =f& `V RAQ@U €nR e•@A
=>t@U “CD
A_Z@ =A• @AS =AP @Vl >?@A gdWc= e„R RnR ‘_bC RY ed[_ A=` AtW A=`b ]V A_Z
@ =A• =>t@U
“CD eY =ACl RnR bc@A RY =>l@U eY
'|
gh&
=ACl
RQ
<An<
gS}_
eyW
iŠ
A_Z@
=A•
=A[@U
e_c<
rW
‘_>
i=
glRd`C@=s
Ví
dụ
1:
<HTML>
<HEAD>
;< =>?@A BCD
<TITLE>Welcome
to
HTML</TITLE>
</HEAD>
<BODY>
<H3>My
first
HTML
document</H3>
</BODY>
</HTML>
>?@A gdWc= =A[@U g•RA @Aw@U bc@A @VW ]V A_Z@ =A• =>t@U “CD @AS A?@A
Hình
1.3:
Kết
quả
ví
dụ
1
1.3.1
HTML
Development
V_ b_cd eS•R A_Z@ =A• =>j@ =>?@A gdWc= ';W =>?@A gdWc= bV U? ˜ >?@
A gdWc= bV
`a= …@U gh@U eS•R RV_ eq= =>j@ `nW kAnRA >?@A gdWc= e„R `z @Ud‚@
]V A_Z@
=A• =>t@U =ACl RnR bc@A =>l@U eY
>?@A gdWc= eS•R if gh@U eZ €C` RnR =>t@U BCD ]V e_^d AS}@U>?@A gdWc=
eS•R D_P=
eP@ i}` @A~= bV lit_R& eS•R <An= =>_Z@ D{_ >d@U =y` …@U gh@U i_jd `nW
=|@A Œd•R
U_t
UVW
@tW&
RY
@A_^d
=>?@A
gdWc=
eS•R
if
gh@U
=>j@
@=C>@C=
C=iRt<C™i
t]_Ut=l> ]V _R>lil‘=™i @=C>@C= €<bl>C> bV At_ =>?@A gdWc= eS•R if gh@U
<Aš D_P@
•_ ]}_ @USx_ g‡@U& =>?@A gdWc= g› if gh@U D{_ ]? @Y RY U_tl g_c@
e‚ A„t ]
}_ ]_cR =>œ
]V k|RA RAda=
Z =Xl `a= =V_ b_cd @Ud‚@&DX@ <A\_ R‰@ `a= =>?@A ilX@ =A\l UVW @tW
& RY @A_^d
=>?@A
ilX@
=A\l
et@U
eS•R
if
gh@U*
_R>lil‘=
,>l@=$tUC
bV
`a=
R[@U
Rh
=š@U
A•<
eS•R g‡@U eZ =Xl& =A_P= kP ]V A_cd RAu@A RnR =>t@U BCD AQ@U =t Rˆ@U RY
=AZ =Aj`
]‹@ D\@& A?@A \@A & D\@U ]V @Aw@U =AV@A <A‰@ kAnR ]Vl =>t@U Aj
` ]Vl eY&
`a= D_Zd `–d Rˆ@U RY =AZ eS•R =Xl >t D’@U ,>l@=$tUC a= kA_ RAQ@U =t =
Xl >t U_tl
g_c@ RAl =>t@U “CD& ,>l@=$tUC =p ea@U =Xl `z R‰@ =A_P= AQ@U =t R
ˆ@U RY =AZ
g‡@U l=C<tg eZ =Xl =V_ b_cd Z €C` eS•R =V_ b_cd =>j@ =>?@A gdWc=
DX@ <A\_
bSd @Y ]}_ ed[_ bV A=` AtW A=`b
nR bc@A eS•R U„_ bV RnR =Am nR =Am @VW eS•R g‡@U eZ e_^d kA_Z@ @
a_ gd@U ]V
A?@A =A…R
=>?@A DVW R•t =V_ b_cd Am `{ r#%s ]V =Am eY@U r#Ž%s
& RAu >t ip
Dƒ= e‰d ]V kP= =AQR R•t `a= bc@A
'| gh& =Am eS•R if gh@U eZ en@A g~d ip Dƒ= e‰d ]V kP= =AQR R•t =V_ b_c
d
<HTML>
.
.
.
+
;< =>?@A BCD
</HTML>
AQ o >’@U RnR =Am kA[@U <Ay@ D_c= RAw Alt ]V RAw =ASx@U& ]? =AP DX@ RY =A
Z if gh@U
#A=`b% =AtW RAl #%
Am Dtl U‚`*
<ELEMENT
ATTRIBUTE
=
value>
$A‰@ =f* @A;@ gX@U =Am
AdaR =|@A* [ =\ =Am
'tbdC* U_n =>• eS•R =A_P= b;< RAl =AdaR =|@A
'| gh& <BODY
BGCOLOR
=
lavender>
>l@U ]| gh =>j@& 6-E bV <A‰@
=f& 6--@^@ bV =AdaR =|@A ]V rbt
]C@gC>s bV
U_n =>• A_ RQ <An< eS•R =ApR A_c@& `Vd @^@ RAl R\ =>t@U
eS•R =
A_P= b;< bV
`Vd rbt]C@gC>s
1.3.2
Cấu
trúc
của
một
tài
liệu
HTML
a= =V_ b_cd U‚` <A‰@ RT D\@*
$A‰@ * „_ =V_ b_cd <A\_ Dƒ= e‰d D’@U =Am `{
#%
]V kP= =AQR D’@U =Am eY@U #Ž%
<HTML>
…. </HTML>
Am Dnl RAl =>?@A gdWc= D_P= @a_ gd@U U_wt At_ =Am @VW bV `a= =V_ b_
cd
$A‰@
=_jd
e^*
$A‰@
=_jd
e^
Dƒ=
e‰d
D’@U
=Am
#%
]V
kP=
=A
QR
D{_
=Am
#Ž% $A‰@ @VW RA…t =_jd e^ `V eS•R A_Z@ =A• =>j@ =At@A e_^d
AS}@U R•t
=>t@U
BCD
_jd
e^
@’`
=>l@U
=Am
&
Dƒ=
e‰d
D’@U
=Am
#
%
]V
kP=
=AQR bV =Am #Ž%
_jd e^ bV <A‰@ kAn Œdt@ =>„@U nR `•R eS•R g‡@U eZ en@A g~d `a
= “CD i_=C
>?@A gdWc= if gh@U =_jd e^ eZ bSd =>w RnR `•R @VW l eY& kA_ @USx_ g‡@U
=?` k_P`
=A[@U =_@& =_jd e^ R•t =>t@U BCD Rd@U R~< =• kAYt RA|@A WPd RAl ]_cR =?` k_P
`
$A‰@ =Ay@* <A‰@ @VW @’` itd <A‰@ =_jd e^ $A‰ž@ =Ay@ Dtl U‚` ]‹@
D\@& A?@A
\@A ]V RnR b_j@ kP= `V DX@ `d•@ A_Z@ =A• =>j@ =>t@U “CD R•t `?@A
$A‰@ =Ay@
Dƒ= e‰d D’@U =Am #6-E% ]V kP= =AQR D’@U =Am #Ž6-E%
Ví
dụ
2:
<HTML>
<HEAD>
<TITLE>Welcome
to
the
world
of
HTML</TITLE>
</HEAD>
<BODY>
<P>This
is
going
to
be
real
fun</P>
</BODY>
.
;< =>?@A BCD
</HTML>
Hình
1.4:
Kết
quả
của
ví
dụ
2
Đoạn
6X@ RY RAQ o eP@ =Am #$% =>l@U ]| gh kA[@U˜ Am #$% eZ =>?@A DVW `a= el
X@
A_ ]_P= `a= DV_ Dnl AtW `a= DV_ bd;@& DX@ @AY` @a_ gd@U =AV@A `a= blX=
RnR elX@
hR e|RA bV @AY` RnR o =S{@U blU_R bX_ ]}_ @Atd ]V n< gh@U `a= i• e•@A gX
@U RAl @a_
gd@U
>l@U
`a=
=V_
b_cd
&
@a_
gd@U
RY
=AZ
eS•R
@AY`
=AV@A
RnR
elX@
Am
elX@ #$% eS•R if gh@U eZ en@A g~d ip Dƒ= e‰d R•t `a= elX@ `}_
Ví
dụ
3
<HTML>
<HEAD>
<TITLE>Welcome
to
HTML</TITLE>
</HEAD>
<BODY
BGCOLOR
=
lavender>
<P>This
is
going
to
be
real
fun
<P>
Another
paragraph
element
</BODY>
</HTML>
Hình
1.5:
Kết
quả
của
ví
dụ
3
Am eY@U #Ž$% bV kA[@U Dƒ= DdaR Am #$% kP =_P< iŠ =p ea@U Dƒ= e‰d `a= el
X@ `}_
Các
thẻ
ngắt
1
;< =>?@A BCD
$A‰@ =f #6% eS•R if gh@U eZ @Uƒ= gv@U =>l@U =V_ b_cd Am #6
% Dš id@U
`a= ko =p €d•@U gv@U =X_ ]• =>| R•t =Am
Ví
dụ
4:
<HTML>
<HEAD>
<TITLE>Welcome
to
HTML</TITLE>
</HEAD>
<BODY
BGCOLOR
=
lavender>
<P>This
is
going
to
be
real
<BR>fun
<P>
Another
paragraph
element
</BODY>
</HTML>
Value Description
C‘= '‹@ D\@ eS•R Rt@A b^ =>n_
C@=C> '‹@ D\@ eS•R Rt@A U_wt
_UA= '‹@ D\@ eS•R Rt@A <A\_
Fdi=_‘W '‹@ D\@ eS•R Rt@A e^d At_ Dj@
Hình
1.6:
Kết
quả
của
ví
dụ
4
Chọn
canh
lề
AdaR =|@A tb_U@ eS•R if
gh@U eZ Rt@A b^ RAl RnR <A‰@
=f =>l@U =>
t@U BCD
AQ@U =t RY =AZ Rt@A b^ ]‹@ D\@& RnR e•_ =S•@U& A?@A \@A& RnR elX@& RnR <Ay
@ elX@&
td eyW& DX@ iŠ A„R RnRA Rt@A b^ ]‹@ D\@*
<A\_ =A? `qR e•@A bV =>n_
:
;< =>?@A BCD
Ví
dụ
5
<HTML>
<HEAD>
<TITLE>Learning
HTML</TITLE>
</HEAD>
<BODY
BGCOLOR=lavender>
<
P
align
=
right
>
This
is
good
fun</P>
</BODY>
</HTML>
t@A b^ eS•R `qR e•@A gpt ]Vl AS}@U R•t ]‹@ D\@ Pd AS}@U ]‹@ D\@ bV =• =>n_ it@U
AdaR =|@A tb_U@ U‚` RnR U_n =>• itd*
Ký
tự
đặc
biệt
Mã
định
dạng
Ví
dụ
}@ AT@ % ŸU=
<HTML>
<HEAD>
<TITLE>Learning
HTML</TITLE>
</HEAD>
<BODY>
<CODE>If A > B Then <BR> A = A + 1
</CODE>
<P>
The
above statement used special
characters
</BODY>
</HTML>
Aœ AT@ # Ÿb=
<HTML>
<HEAD>
<TITLE>Learning
HTML</TITLE>
</HEAD>
<BODY>
<CODE>If
A
<
B
Then
<BR>
A
=
A
+
1
</CODE>
<P> The above statement used special
characters
</BODY>
</HTML>
>|RA g–@rr ŸŒdl=
<HTML>
<HEAD>
<TITLE>Learning
HTML</TITLE>
</HEAD>
<BODY>
" To be or not to be ? " That
is
the
question
</BODY>
</HTML>
o =p rŸs Ÿt`<
<HTML>
<HEAD>
Hình
1.7:
Kết
quả
của
ví
dụ
5
$A‰@ =_jd e^ Rˆ@U RA…t <A‰@ =f $A‰@ =f @VW Rd@U R~< =A[@U =_@ ]^
=>t@U “CD
R•t DX@ Y U‚` =j@ =nR U_\& =j@ <A‰@ `^` g‡@U eZ ]_P= =>t@U eY& =j@ R[@U
=W& =A[@U
=_@ b_j@ bXR $A‰@ =f if gh@U ip kP= A•< U_wt =AdaR =|@A ]V U_n =>•
'| gh& eZ RAu >tAt` 6>l“@C bV =nR U_\& @USx_ =t if gh@U <A‰@ =f @A
S itd*
<META
name=”Author”
content=”Graham
Browne”>
nR U_\ R•t =V_ b_cd bV r>tAt` 6>l“@Cs
AdaR
=|@A
A==<¡CŒd_]
RY
=AZ
eS•R
if
gh@U
eZ
=AtW
=AP
=AdaR
=|@A
@t`C
nW
RA•
$
if
gh@U
=AdaR
=|@A
@VW
eZ
=Xl
>t
`a=
e‰d
en<
…@U
$
$
>Ci<l@iC
ACtgC>
‰d en< …@U eS•R =>dW^@ eP@ =>?@A gdWc= eZ @A;@ gX@U gw b_cd Pd =>?@A
gdWc= A_Zd
eS•R e‰d en< …@U @VW& @Y iŠ =_P@ AV@A RnR AV@A ea@U eqR D_c= e•_ ]}_ e‰d en
< …@U eY
'|
gh&
<META
http-equiv=”Expires”
content=”Mon,
15
Sep
2003
14:25
:27
GMT”>
iŠ i_@A >t `a= e‰d en< …@U $ @AS itd*
Expires:
Mon,
15
Sep
2003
14:25:27
GMT
l ];W& @Pd =V_ b_cd ez bSd bX_& $ iŠ D_P= kA_ @Vl =>dW €d~= `a= D\@ itl R
•t =V_ b_cd
=ST@U …@U
1.3.4
Sử
dụng
ký
tự
đặc
biệt
trong
tài
liệu
HTML
4
gdWc= kA[@U @A‰` RAQ@U ]}_ =Am & DX@ <A\_ Un@ `z e•@A gX@U RAl RnR
ko =p eqR
;< =>?@A BCD
D_c= @VW
<TITLE>Learning
HTML</TITLE>
</HEAD>
<BODY>
<P>
William
&
Graham
went
to
the
fai
r
</BODY>
</HTML>
1.4
SỬ
DỤNG
CÁC
SIÊU
LIÊN
KẾT
_jd b_j@ kP= bV `a= <A‰@
=f Dj@ =>l@U =V_ b_cd
`V b_j@
kP= eP@
`a= ]• =>|
kAnR =>l@U
R‡@U =V_ b_cd eY AlqR eP@ `a= =V_ b_cd AlV@ =lV@ kAnR
A¢ ¢£¢¢@U¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
A¢¢
¢¢¢¢
X¢¢@&¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
kA_¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
=t¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
k|R
A¢¢
¢¢¢¢
¢¢¢
¢¢¢¢
]Vl¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
i_jd
b_j@¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
k¢¢
¢¢¢¢
P¢¢=¢¢
¢¢¢¢
¢¢¢
¢¢¢¢
i¢¢
¢¢¢¢
Š¢¢
@A¢ ¢\¢¢W¢¢
eP¢ ¢@¢¢
¢¢¢¢
¢¢¢
¢¢¢¢
b_j@¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
k¢¢
¢¢¢¢
P¢¢=¢¢
¢¢¢¢
¢¢¢
¢¢¢¢
R¢¢
¢¢¢¢
‰¢¢@¢¢
eP¢ ¢@¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
nR¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
i_jd¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
b_j@¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
k¢¢
¢¢¢¢
P¢¢=¢¢
¢¢¢¢
¢¢¢
¢¢¢¢
bV¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
=AV@A¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
<A¢ ¢
¢¢¢¢
‰¢¢@¢¢
¢¢¢¢
¢¢¢
¢¢¢¢
Œdt@¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
=
>¢¢
¢¢¢¢
„¢¢@U¢ ¢
¢¢¢¢
¢¢¢
¢¢¢¢
@A¢ ¢
¢¢¢¢
~¢¢=
R•¢ ¢t¢¢¢¢¢Ac¢ ¢
=A¢ ¢•¢¢@U¢ ¢¢¢¢i_jd¢ ¢¢¢¢]‹¢ ¢@¢¢¢¢¢D¢¢\¢¢@
1.4.1
Giới
thiệu
siêu
liên
kết
và
URL
A\ @‹@U RA|@A R•t bV A— =>• i_jd b_j@ kP= a= i_jd b_j@ kP=& AtW @Y_
@Uƒ@ U„@
bV `a= b_j@ kP=& bV ip kP= @•_ eP@ =V_ b_cd AtW ‘_bC kAnR e‚ A„t& y` =At@A& ]_
gCl AlqR
@UtW R\ eP@ `a= <A‰@ kAnR =>l@U R‡@U =V_ b_cd eY A_ k|RA ]Vl i_jd b_j@
kP=& @USx_
g‡@U eS•R eSt eP@ e•t RAu `V RAQ@U =t RAu >” =>l@U b_j@ kP=
a= <A‰@ kAnR =>l@U R‡@U =V_ b_cd
a= =V_ b_cd kAnR
a= <A‰@ =>l@U =V_ b_cd kAnR
nR ‘_bC kAnR L A?@A \@A& y` =At@A& =>|RA elX@ ]_gCl
'• =>| AlqR `nW RA• kAnR
Hình
1.8:
Sử
dụng
liên
kết
nR b_j@ kP= RY =AZ bV b_j@ kP= =>l@U AlqR b_j@ kP= @UlV_
Liên
kết
trong
bV b_j@ kP= kP= @•_ eP@ RnR <A‰@ =>l@U R‡@U =V_ b_cd AlqR
R‡@U `a=
“CD i_=C
;< =>?@A BCD
Liên
kết
ngoài
bV b_j@ kP= kP= @•_ eP@ RnR =>t@U =>j@ RnR “CD i_=C kAnR
AlqR `nW
RA• kAnR
Hình
1.9:
Liên
kết
trong
và
liên
kết
ngoài
Z =Xl i_jd b_j@ kP=& RAQ@U =t R‰@ <A\_ €nR e•@A At_ =AV@A <A‰@*
•t RAu e‰W e• AlqR R•t ‘_bC eS•R kP= @•_
_Z` @Y@U Rd@U R~< RAl b_j@ kP= _Z` @Y@U @VW RY =AZ bV `a= gv@U ]‹@
D\@& =A;`
RA| bV `a= \@A
A_ @USx_ g‡@U k|RA ]Vl e_Z` @Y@U& =>?@A gdWc= e„R e•t RAu eS•R RAu >t =>l@
U ]V
r@A\Ws eP@ ]• =>| `}_
—_ @Ud‚@ =V_ @UdWj@ =>j@ BCD RY `a= e•t RAu gdW @A~= '| gh& 4.+4
: bV e•t
RAu “CD i_=C R•t _Rl>il‘= _x eyW& eZ @A} RnR Rl@ i• @VW >~= kAY ]V g› @A
‰` b–@ '?
];W& @USx_ =t if gh@U RnR bV `a= RAd—_ Rd@U R~< e•t RAu @=C>@C
= R•t “CD
i_=C AtW =V_ @UdWj@ =>j@ Bl>bg B_gC BCD
•@A gX@U eqR =>S@U bV
“““@t`Cl‘i_=C=W<Cl‘i_=CRl@=>WRlgC
¤=>l@U eY
t`Cl‘i_=C* =j@ R•t i_=C
W<Cl‘i_=C* k_Zd R•t i_=C
l@=>WRlgC* `z @S}R¥
'| gh& +:4 RY =AZ eS•R D_Zd g_›@ D’@U bV
“““UllUbCRl`
Rˆ@U @A;@ D_P= eS•R U_tl =A…R `V i_=C AtW =V_ @UdWj@ eS•R =>dW @A;<
X@U
=A[@U =ASx@U @A~= bV rA==<s& @Y Rd@U R~< e•t RAu @=C>@C= R•t `a= =>t@U BC
D a= ]V_
gX@U kAnR bV rUl<AC>s& @Y Rd@U R~< e•t RAu @=C>@C= R•t `a= =AS `hR
l<AC>& ]V
r‘=<s& Rd@U R~< ]• =>| R•t `a= =V_ @UdWj@ ,$ =>j@ `X@U
;< =>?@A BCD
Rˆ@U RY =AZ =At` RA_Pd eP@ `a= ]• =>| =>l@U `a= =V_ @UdWj@ '| gh& DX@
RY =AZ =Xl
b_j@ kP= eP@ `a= RA• e^ =>l@U R‡@U `a= =V_ b_cd >l@U =>Sx@U A•< eY& e•@A
gt@A elX@
eS•R if gh@U { <A‰@ Rd•_ R•t
•@A gX@U bV& U_tl =A…R* =j@ R•t i_=C Ž =V_ b_cd RA|@A ¦e•@A gt@A elX@
Y At_ gX@U *
URL
tuyệt
đối
L bV e•t RAu @=C>@C= e‰W e• R•t =>t@U AlqR ‘_bC& Dtl U‚`
U_tl =A…R&
]•
=>|
`X@U&
eSx@U
g–@
=‡W
RA„@
]V
=j@
‘_bC
'|
gh&
A==<*ŽŽ“““`_R>li
l‘=Rl`
bV
`a= e•t RAu =dWc= e•_
URL
tương
đối
L bV `a= RY `a= AlqR @A_^d <A‰@ D• =A_Pd >?@A
gdWc= b~W
=A[@U =_@ D• =A_Pd =• =>t@U RA…t eY '| gh& @Pd U_tl =A…R D• =A_Pd& =
>?@A gdWc=
if gh@U U_tl =A…R R•t =>t@U A_c@ =Ax_
1.4.2
Sử
dụng
siêu
liên
kết
Am
#%
eS•R
if
gh@U
eZ
€nR
e•@A
]‹@
D\@
AtW
\@A
@Vl
iŠ
g‡@U
bV`
i_j
d
b_j@
kP=
=>l@U =V_ b_cd AdaR =|@A , =At` RA_Pd i_jd ]‹@ D\@ eS•R g
‡@U eZ RAu
e•t RAu AtW R•t =V_ b_cd AlqR ‘_bC eS•R b_j@ kP=
Q <An< R•t , bV*
<A
HREF
=
protocol://host.domain:port/path/filename>Hypertext</A>
>l@U eY&
_tl =A…R L yW
bV blX_ U_tl =A…R a= i• U_tl =A…R =ASx@U g‡@U*
A==< L U_tl =A…R =>dW^@ i_jd ]‹@ D\@
=Cb@C= L `{ `a= <A_j@ =Cb@C=
Ul<AC> L =?` k_P` ‘_bC
‘=< L U_tl =A…R =>dW^@ ‘_bC
`t_b=l L Uf_ =AS e_c@ =f
li=gl`t_@ L yW bV e•t RAu @=C>@C= R•t `nW RA•
$l>= ¡
š@U <AhR ]h R•t `nW RA• e|RA
W<C>C€= L yW bV ]‹@ D\@ AtW A?@A \@A `V @USx_ g‡@U R‰@ @A~< ]
Vl eZ k|RA
AlX= b_j@ kP=
Liên
kết
đến
những
tài
liệu
khác
_\ if RY At_ =V_ b_cd =>j@ e•t R…@U RhR Da& lRA=` ]V lRA=`
Z =Xl `a=
b_j@ kP= =• lRA=`b eP@ lRA=`
Ví
dụ
6:
<HTML>
<HEAD>
<TITLE>
Using
links</TITLE>
</HEAD>
;< =>?@A BCD
<BODY>
<BR><BR>
<P>
This
page
is
all
about
creating
links
to
documents.
<A
HREF
=
Doc2.html>Click
here
to
view
document
2</A>
</BODY>
</HTML>
Hình
1.10:
Kết
quả
của
ví
dụ
6
A_ @USx_ g‡@U r@A\Ws eP@ `a= =V_ b_cd kAnR& DX@ @j@ Rd@U R~< RnRA eZ Œ
dtW =>{ bX_
=>t@U RA• AlqR e•@A AS}@U eP@ `a= ‘_bC kAnR
Ví
dụ
7:
<HTML>
<HEAD>
<TITLE>
Document
2</TITLE>
</HEAD>
<BODY>
<BR><BR>
<P>
This
is
document
2.
This
page
is
displayed
when
you
click
the
hyperlink
in
Document
1
<BR><BR>
<A
HREF=
Doc1.html>Back
Home</A>
</BODY>
</HTML>
;< =>?@A BCD
Hình
1.11:
Kết
quả
ví
dụ
7
AQ o bV RnR b_j@ kP= eS•R UXRA RAy@ >?@A gdWc= =p ea@U UXRA RAy@ RnR b_
j@ kP= Y
Rˆ
§
@U =AtW eš_ A?@A gn@U Rl@ =>œ RAda= kA_ @USx_ if gh@U g_ RAdWZ@ RAda= ]V
l b_j@ kP=
¨ ]| gh =>j@& RnR ‘_bC @’` =>l@U R‡@U `a= =AS `hR& ]? ];W RAu R‰@ RAu >t =j@
‘_bC =>l@U
=A[@U
i•
,
bV
e•
dW
@A_j@&
eZ
b_j@
kP=
eP@
RnR
‘_bC
{
=AS
`hR
kAnR
&
R‰@
<A\_
Rd@U R~< eSx@U g–@ =dWc= e•_ AtW eSx@U g–@ =ST@U e•_
Đường
dẫn
tuyệt
đối
RAu
>t
eSx@U
g–@
e‰W
e•
=•
=AS
`hR
U•R
eP@
‘_b
C
'|
gh&
*©`Wg_>CR=l>W©A=`b C€t`<bCi© lRA=`
Đường
dẫn
tương
đối
RAu >t ]• =>| b_j@ Œdt@ R•t ‘_bC ]}_ ]• =>| ‘_bC A_c@ =X_ '
| gh& @Pd
=AS `hR A_c@ AV@A bV `Wg_>CR=l>W =A? eSx@U g–@ iŠ bV &
<A
HREF=
“ \Doc3.htm”>Next
page</A>
'? ];W& @Pd `d•@ b_j@ kP= RnR =V_ b_cd kA[@U b_j@ Œdt@ ]}_ @Atd =A? =t @j@ g
‡@U eSx@U
g–@ =dWc= e•_ dW @A_j@& @Pd =t RY `a= @AY` =V_ b_cd RY b_j@ Œdt@ ]}_ @Atd&
RA£@U AX@
<A‰@ =>• U_Q< =>l@U & =A? =t @j@ if gh@U eSx@U g–@ =ST@U e•_ RAl R
nR =V_ b_cd
=>l@U @AY` ]V eSx@U g–@ =dWc= e•_ RAl RnR =V_ b_cd kA[@U b_j@ Œdt@ =>pR =_P
< eP@ RA•
e^ A_ eY @USx_ g‡@U RY =AZ RV_ eq= <A‰@ =>• U_Q< @VW =>l@U =AS `hR `?@A R
A„@ ]V @Y
]–@ AlX= ea@U
Liên
kết
đến
các
phần
trong
cùng
một
tài
liệu
Am
@Cl
#%
t@RAl>
eS•R
if
gh@U
eZ
@USx_
g‡@U
RY
=AZ
r@A\Ws
eP@
@
Aw@U
<A‰@
kAnR @Atd R•t `a= =V_ b_cd '| gh& DX@ RY =AZ A_Z@ =A• @a_ gd@U R•t =>t@U BC
D @AS `a=
blX= RnR b_j@ kP= A_ @USx_ g‡@U k|RA ]Vl `a= e^ =V_ @Vl eY =A? RnR RA_ =_P=
@’` { `a=
<A‰@ kAnR R•t =V_ b_cd eS•R A_Z@ =A•
_Zd b_j@ kP= @VW U„_ bV r@t`Cg t@RAl>s D{_ ]? =AdaR =|@A eS•R if g
h@U eZ =Xl
RnR b_j@ kP= @VW
<A
NAME
=
“marker”>Topic
name</A>
6X@ kA[@U <A\_ if gh@U D~= k† ]‹@ D\@ @Vl eZ en@A g~d e_Z` @Cl
Z g‡@U& =t if gh@U ]XRA g~d `t>kC> =>l@U =A[@U i• , @AS itd
<A
HREF=
“#marker”>Topic
name</A>
+
;< =>?@A BCD
~d ¦ { =>S}R =j@ R•t i_jd b_j@ kP= eZ Dnl RAl =>?@A gdWc= D_P= >’@U b_j@ kP= @
VW b_j@ kP=
eP@ `a= e_Z` eS•R eq= =j@ =>l@U =V_ b_cd A_ kA[@U RY =V_ b_cd @Vl eS•R R
Au >t =>S}R
ko =p ¦& =>?@A gdWc= A_Zd >’@U b_j@ kP= @VW @’` =>l@U R‡@U =V_ b_cd
Ví
dụ
8:
<HTML>
<HEAD>
<TITLE>Using
Links</TITLE>
</HEAD>
<BODY>
<A
HREF
=
#Internet>Internet</A>
<BR><BR>
<A
HREF
=
#HTML>Introduction
to
HTML</A>
<BR><BR>
<A
HREF
=
#Consistency>Unity
and
Variety</A>
<BR><BR>
<A
name
=
Internet>Internet</A>
<BR>
<P>
The
Internet
is
a
network
of
networks.
That
is,
computer
networks
are
linked
to
other
networks,
spanning
countries
and
today
the
globe.
The
TCP/IP
transfer
protocol
provides
the
bind
ings
that
connect
all
these
computers
the
world
over.
</P>
<A
name
=
HTML>Introduction
to
HTML</A>
<BR>
<P>
Hyper
Text
Markup
Language
is
the
standard
lang
uage
that
the
Web
uses
for
creating
and
recognizing
documents.
Altho
ugh
not
a
subset
of,
it
is
loosely
related
to
the
Standard
Generaliz
ed
Markup
Language (SGML). SGML is a method for representing
document
formatting
languages.
</P>