Nó là một tập hợp các quy tắc và các thẻ tag đợc sử dụng để quy định các thức trình bày,hiển thị nội dung của các trang Web, tập hợp các quy tắc và thẻ này phải tuân theo mộtchuẩn quốc t
Trang 11.2 HTML là gì? 3
1.3 Trình duyệt Web 3
Chơng 2 Các thẻ định cấu trúc tài liệu 4
2.1 HTML 4
2.2 HEAD 4
2.3 TITLE 5
2.4 BODY 5
Chơng 3 các thẻ định dạng khối 7
3.1 Thẻ chú thích <! > 7
3.2 Thẻ ADDRESS 7
3.3 P 7
3.4 Các thẻ định dạng đề mục H1/H2/H3/H4/H5/H6 9
3.5 Thẻ xuống dòng BR 10
3.6 Thẻ PRE 10
3.7 Thẻ BLOCKQUOTE 11
chơng 4 các thẻ định dạng danh sách 13
4.1 Danh sách mô tả 13
4.2 Danh sách thông thờng 14
chơng 5 các thẻ định dạng ký tự 18
5.1 Các thẻ định dạng in ký tự 18
5.2 Căn lề văn bản trong trang Web 21
5.3 Các ký tự đặc biệt 23
5.4 Sử dụng màu sắc trong thiết kế các trang Web 24
5.5 Chọn kiểu chữ cho văn bản 27
5.6 Khái niệm văn bản siêu liên kết 29
5.7 Địa chỉ tơng đối 32
5.8 Kết nối mailto 32
5.9 Vẽ một đờng thẳng nằm ngang 33
Chơng 6 các thẻ chèn âm thanh, hình ảnh 35
6.1 Giới thiệu 35
6.2 Đa âm thanh vào một tài liệu HTML 36
6.3 Chèn một hình ảnh, một đoạn video vào tài liệu HTML 37
6.4 Cuộn văn bản 40
6.5 Bản đồ ảnh 41
Chơng 7 Các thẻ định dạng bảng biểu 44
Chơng 8 Frame 49
Chơng 9 java Applet 56
9.1 Java là gì? 56
Trang 29.2 Java Applet 56
9.3 §a mét Java Applet vµo trong trang Web 56
Ch¬ng 10 FORM 59
10.1 HTML Forms 59
10.2 T¹o Form 59
10.4 T¹o mét danh s¸ch lùa chän 61
10.5 T¹o hép so¹n th¶o v¨n b¶n 63
Phô lôc 64
Trang 3Chơng 1 Ngôn ngữ đánh dấu siêu văn bản - HTML
1.1 World Wide Web
World Wide Web viết tắt là WWW, là một dịch vụ Internet đợc xây dựng trên giao
thức HTTP (HyperText Transfer Protocol), nó cho phép cấu hình các máy tính servertheo một cách đặc biệt để có thể phân phối các dữ liệu trên mạng theo một cách thứcchuẩn
1.2 HTML là gì?
HTML viết tắt của HyperText Mark-up Language (ngôn ngữ đánh dấu siêu văn bản) Nó
là một tập hợp các quy tắc và các thẻ (tag) đợc sử dụng để quy định các thức trình bày,hiển thị nội dung của các trang Web, tập hợp các quy tắc và thẻ này phải tuân theo mộtchuẩn quốc tế, đảm bảo cho các trình duyệt Web khác nhau, trên các nền phần cứng và
hệ điều hành khác nhau đều hiểu đợc và hiển thị đúng nội dung của các trang Web.HTML không phải là một ngôn ngữ lập trình, nó là một ngôn ngữ đánh dấu HTML dễhiểu hơn nhiều so với hầu hết các ngôn ngữ lập trình
Một tài liệu HTML là một tệp tin văn bản trong đó có sử dụng các thẻ HTML để quy
định cách thức hiển thị văn bản khi nó đợc mở bởi một trình duyệt Web
Cơ bản các thẻ định dạng trong HTML thờng có từng cặp gồm: thẻ mở <tag> và thẻ
đóng </tag> Các văn bản nằm giữa hai thẻ này sẽ đợc chịu tác động định dạng bởi thẻ
Ví dụ, thẻ <B> dùng để định dạng chữ in đậm, khi đó văn bản “<B>Hello</B>” sẽ đợc
hiển thị là “Hello”.
Nếu các trình duyệt, các nhà thiết kế trang Web khác nhau sử dụng các quy tắc đánh dấukhác nhau cho tiêu đề, bảng hay danh sách thì chúng ta sẽ thấy môI trờng Web sẽ trởnên hỗn loạn Vì thế, việc phát triển của HTML đợc thực hiện dới sự giám sát nghiêmngặt của tổ chức World-Wide Web Consortium (W3C)
1.3 Trình duyệt Web
Trình duyệt Web (Web browser) là những chơng trình có thể thực hiện một số chứcnăng cơ bản nh tìm kiếm và hiển thị các trang Web theo đúng các định dạng bởi các thẻHTML trong đó Các trình duyệt Web thông dụng hiện nay là: Internet Explorer,Netscape, Mossaic,
Trang 42.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ụngcá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 Tấtcả các tập tin HTML đều bắt đầu bằng thẻ <HTML> , thẻ này thông báo cho trình duyệt
Web biết rằng nó đang đọc một tài liệu có chứa các mã HTML và cuối các tập tinHTML sẽ là thẻ đóng tơng ứng </HTML> thông báo kết thúc tài liệu
hệ đợc thiết lập giữa tài liệu và các th mục Thẻ HEAD đợc dùng để xác định phần mở
đầu cho tài liệu
Cú pháp:
2.3 TITLE
Bạn có thể đặt tiêu đề cho tài liệu HTML của mình Tiêu đề này sẽ không đợc hiển thịtrên phần thân của văn bản mà đợc hiển thị trên thanh tiêu đề của trình duyệt hay trongbookmark của ngời sử dụng Nên đặt tiêu đề cho mỗi trang, bởi vì khi đợc đánh dấutrang , tên đợc hiển thị trên bookmark sẽ là một tên hợp lý, mang tính gợi nhớ (thông th-ờng có thể soạn thảo đợc tên của boookmark nhng ngầm định thì tên boookmark trùngvới tiêu đề trang Nếu không có tiêu đề trang thì URL của văn bản sẽ là tên
<HEAD>
Phần mở đầu (HEADER) của tài liệu đợc đặt ở đây
</HEAD>
Trang 5<TITLE>Tiêu đề của tài liệu</TITLE>
<BODY Các tham số nếu có>
Nội dung của tài liệu
Cú pháp:
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ềuthuộc tính đợc sử dụng trong thẻ BODY Sau đây là các thuộc tính chính:
BACKGROUND= Đặ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.
BGCOLOR= Đặ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.
TEXT= Xác định màu chữ của văn bản, kể cả các đề mục.
ALINK=,VLINK=,LINK= 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 đề
Nội dung tài liệu
Trang 6Chú ý rằng đoạn ghi chú sẽ không đợc hiển thị trong cửa sổ chính của trình duyệt, tuy
nhiên nếu ngời dùng chọn chức năng xem mã nguồn của trình duyệt (ví dụ chọn View/ Source với IE5) thì có thể xem đợc các ghi chú này.
Cú pháp:
3.2 Thẻ ADDRESS
Thông thờng nên nêu ra ngời chịu trách nhiệm bảo trì trang WEB Trong nhiều trờnghợp đây có thể là ngời tạo ra trang WEB Tuy nhiên nhiều công ty tạo ra các website củamình trên Internet, khi đó sẽ có một nhóm ngời chịu trách nhiệm bảo trì site đó, giảiquyết các vấn đề kỹ thuật để site có thể hoạt động bình thờng hay khắc phục khi có sự
cố xảy ra – các webmaster Thẻ <ADDDRESS> đợc sử dụng để định dạng các thôngtin nh địa chỉ, danh thiếp, tên tác giả, thờng đặt ở đầu hay cuối tài liệu Các thông tinnày sẽ giúp liên hệ ngợc lại với ngời chịu trách nhiệm về trang Web đó Văn bản đợc
định dạng bởi thẻ <ADDRESS> sẽ đợc in nghiêng
Cú pháp:
<! Lời ghi chú >
Trang 7Trớc tác động mạnh mẽ của trào lu Internet trên thế giới, những ngời đang
trực tiếp làm việc với máy tính trong nghiên cứu, học tập, kinh doanh đều
nóng lòng muốn tìm hiểu công nghệ mang tính thời đại này và tình hình
Internet tại nớc ta.
</P>
<P>
Trên thực tế có nhiều nơi tại Việt Nam đã và đang thực hiện truy cập vào
Internet Đó là một số cơ quan nhà nớc và nớc ngoài có nhu cầu sử dụng
Internet phục vụ cho công việc chuyên môn, nghiên cứu và kinh doanh.
</P>
</BODY>
</HTML>
Khi trình duyệt duyệt văn bản này, kết quả sẽ nh sau:
<P>Nội dung đoạn văn bản</P>
Trang 83.4 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ặtlogic, 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 haycấp 6 thờng có kích thớc nhỏ hơn văn bản thông thờng
Ngời ta thờng để đề mục cấp 1 là dòng lặp lại dòng tiêu đề, nh vậy dòng tiêu đề có thểnhìn thấy đợc trong văn bản Điều này rất quan trọng khi bạn dự định in trnag Webtrong tơng lai bởi vì khác với đề mục, tiêu đề có thể không đợc in trên giấy
Dới đây là các thẻ dùng để định dạng văn bản ở dạng đề mục:
Trang 93.5 Thẻ xuống dòng BR
Thẻ này không có thẻ kết thúc tơng ứng (</BR>), nó có tác dụng chuyển sang dòngmớ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êntụ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ộtkhoảng trắng Để xuống dòng trong tài liệu, bạn phải sử dụng thẻ <BR>
Cú pháp:
3.6 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ẻ <PRE> Vănbả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ấuxuống dòng trong đoạn văn bản giới hạn bởi thẻ <PRE> sẽ có ý nghĩa chuyển sangdòng mới (trình duyệt sẽ không coi chúng nh dấu cách)
Cú pháp:
3.7 Thẻ BLOCKQUOTE
Thờng dùng để trích dẫn một đoạn văn bản hoặc, các đoạn văn bản đợc định dạng bởithẻ <BLOCKQUOTE> sẽ đợc thể hiện bằng phông chữ nghiêng có căn lề lùi vàotrong và thờng có một dòng trống trên và dới
Cú pháp:
<BR
>
<PRE>Văn bản đã đợc định dạng</PRE>
Trang 10Dới đây là một ví dụ sử dụng các thẻ định dạng khối để trình bày trang Web Sử dụngNotepad để soạn một văn bản có nội dung nh sau:
Sông Mã xa rồi Tây Tiến ơi!<BR>
Nhớ về rừng núi nhớ chơi vơi<BR>
Sài Khao sơng lấp đoàn quân mỏi<BR>
Mờng Lát hoa về trong đêm hơi<BR>
Dốc lên khúc khuỷu dốc thăm thẳm<BR>
Heo hút cồn mây súng ngửi trời<BR>
Ngàn thớc lên cao, ngàn thớc xuống<BR>
Nhà ai Pha Luông ma xa khơi<BR>
Anh bạn dãi dầu không bớc nữa<BR>
Gục trên súng mũ bỏ quên đời!<BR>
Chiều chiều oai linh thác gầm thét<BR>
Đêm đêm Mờng Hịch cọp trêu ngời<BR>
Nhớ ôi Tây Tiến cơm lên khói<BR>
Mai Châu mùa em thơm nếp xôi <BR>
</BLOCKQUOTE>
<ADDRESS>Tác giả Quang Dũng (1921-1988) </ADDRESS>
</BODY>
</HTML>
Ghi lại tệp văn bản trên với tên vd33.htm, sau đó sử dụng trình duyệt để mở văn bản
trên Trang tài liệu HTML của bạn sẽ đợc hiển thị nh trong hình dới:
Trang 12chơng 4 Các thẻ định dạng danh sáchDanh sách là một cấu trúc rất hay gặp trong văn bản Có rất nhiều kiểu danh sách: danhsách thông thờng, danh sách có đánh số hay thậm chí các danh sách lồng nhau HTML
cung cấp rất nhiều thẻ định dạng danh sách nh DL, DIR, MENU, UL, OL, LI Định
dạng ở các chơng trớc chủ yếu là các cặp thẻ bắt đầu và kết thúc bao quanh vùng vănbản đợc định dạng Danh sách có hình thức phức tạp hơn Bản thân danh sách cũng đợc
đặt trong cặp thẻ mở đầu và kết thúc, tiếp theo mỗi mục trong danh sách đ ợc xác địnhmột cách riêng biệt Tuy nhiên không có thẻ kết thúc cho mỗi mục, mỗi mục kết thúckhi gặp thẻ mở đầu của mục kế tiếp hay thẻ kết thúc của chính danh sách
<DT>HTML<DD>Hypertext Markup Language
<DT>XML<DD>Extended Markup Language
<DT>WWW<DD>World Wide Web
<DT>WYSIWYG<DD>What You See Is What You Get
<DT> Từ khoá <DD> Lời giải nghĩa
<DT> Từ khoá <DD> Lời giải nghĩa
</DL>
Trang 13 Danh sách phân cấp <DIR>
Với nhiều trình duyệt, danh sách phân cấp và danh sách thực đơn giống danh sáchkhông đánh số, có thể dùng lẫn với nhau Với thẻ OL ta có cú pháp sau:
trong đó:
=a Các mục đợc sắp xếp theo thứ tự a, b, c
=A Các mục đợc sắp xếp theo thứ tự A, B, C
=i Các mục đợc sắp xếp theo thứ tự i, ii, iii
=I Các mục đợc sắp xếp theo thứ tự I, II, III
Ngoài ra còn thuộc tính START= xác định giá trị khởi đầu cho danh sách.
Thẻ < LI > có thuộc tính TYPE= xác định ký hiệu đầu dòng (bullet) đứng trớc mỗi
mục trong danh sách Thuộc tính này có thể nhận các giá trị : disc (chấm tròn đậm);
circle (vòng tròn); square (hình vuông).
<UL>
<LI> Mục thứ nhất
<LI> Mục thứ hai
</UL>
<OL TYPE=1/a/A/i/I>
<LI>Muc thu nhat
<LI>Muc thu hai
<LI>Muc thu ba
</OL>
Trang 15<LI>Chọn mục File, sau đó click chuột vào mục Open
<LI>Đánh vào địa chỉ URL của tài liệu muốn mở
Trang 16Chơng 5 Các thẻ định dạng ký tự
5.1 Các thẻ định dạng in ký tự
HTML không đợc thiết kế cho hệ thống WYSIWYG ( nh Microsoft Word), nó đợc thiết
kế cho mục đích định dạng về mặt logic Ví dụ, nếu bạn định nghĩa một phần văn bản
bằng thẻ <CODE>, trình duyệt sẽ sử dụng một số kiểu định dạng để làm nổi đoạn văn
bản đó so với các kiểu khác Nếu đoạn văn bản đó không đợc định dạng gì cả và màn
hình trình duyệt là đơn sắc thì có thể đoạn văn bản gắn với thẻ CODE đó có thể đợc
hiển thị in đậm trên màn hình nhằm phân biệt với các đoạn văn bản khác Với định dạngvật lý, trình duyệt sẽ hiển thị văn bản đúng nh bạn đã xác định Hiện tại số lợng thẻ logic
Trang 17nhiều hơn nhiều thẻ vật lý Thẻ định dạng vật lý chỉ đợc sử dụng khi muốn in đậm hay innghiêng văn bản.
Sau đây là các thẻ đợc sử dụng để quy định các thuộc tính nh in nghiêng, in đậm, gạchchân cho các ký tự, văn bản khi đợc thể hiện trên trình duyệt
định nghĩa của một từ Chúng thờng đợc in nghiêng hoặc thể hiện qua một kiểu đặc biệt nào đó.
<S> </S>
<STRIKE> </STRIKE>
In chữ bị gạch ngang.
<BIG> </BIG> In chữ lớn hơn bình thờng bằng cách tăng kích
thớc font hiện thời lên một Việc sử dụng các
thẻ <BIG>lồng nhau tạo ra hiệu ứng chữ tăng
dần Tuy nhiên đối với mỗi trình duyệt có giới hạn về kích thớc đối với mỗi font chữ, vợt quá
giới hạn này, các thẻ <BIG> sẽ không có ý
nghĩa.
<SMALL> </SMALL> In chữ nhỏ hơn bình thờng bằng cách giảm
kích thớc font hiện thời đi một Việc sử dụng
các thẻ <SMALL>lồng nhau tạo ra hiệu ứng
chữ giảm dần Tuy nhiên đối với mỗi trình duyệt có giới hạn về kích thớc đối với mỗi font
chữ, vợt quá giới hạn này, các thẻ <SMALL>
sẽ không có ý nghĩa.
<SUP> </SUP> Định dạng chỉ số trên (SuperScript)
<SUB> </SUB> Định dạng chỉ số dới (SubScript)
<BASEFONT> Định nghĩa kích thớc font chữ đợc sử dụng cho
đến hết văn bản Thẻ này chỉ có một tham số size= xác định cỡ chữ Thẻ <BASEFONT> không có thẻ kết thúc.
<FONT> </FONT> Chọn kiểu chữ hiển thị Trong thẻ này có thể
đặt hai tham số size= hoặc color= xác định cỡ chữ và màu sắc đoạn văn bản nằm giữa hai thẻ Kích thớc có thể là tuyệt đối (nhận giá trị từ
1 đến 7) hoặc tơng đối (+2,-4 ) so với font chữ hiện tại.
Trang 195.2 Căn lề văn bản trong trang Web
Trong trình bày trang Web của mình các bạn luôn phải chú ý đến việc căn lề các văn
bản để trang Web có đợc một bố cục đẹp Một số các thẻ định dạng nh P, Hn, IMG
đều có tham số ALIGN cho phép bạn căn lề các văn bản nằm trong phạm vi giới hạn bởi
World Wide Web còn viết tắt là WWW, là một dịch vụ Internet, đợc
xây dựng trên một tập các giao thức thông dụng, nó cho phép cấu
hình các máy tính server theo một cách đặc biệt để phân phối các
bản tin trên mạng theo một cách thức chuẩn
</P>
</BODY>
Trang 20Khi duyệt sẽ có kết quả sau:
Ngoài ra, chúng ta có thể sử dụng thẻ CENTER để căn giữa trang một khối văn bản
Thời gian trôi qua mau chỉ còn những kỷ niệm<BR>
Kỷ niệm thân yêu ơi sẽ còn nhớ mãi tiếng thầy cô<BR>
Bạn bè mến thơng ơi sẽ còn nhớ mãi lúc giận hờn<BR>
Để rồi mai chia xa lòng chợt dâng niềm thiết tha<BR>
Nhớ bạn bè, nhớ mái trờng xa <BR>
</P>
</CENTER>
<CENTER>Văn bản sẽ đợc căn giữa trang</CENTER>
Trang 21Ví dụ á đợc viết là Á.
Dấu trắng có thể đợc sử dụng để tách các chuỗi ký tự là tên của những ký tự đặc biệt, tuynhiên ký tự trắng lại đợc hiển thị Do vậy để viết chữ ádios ta phải viết Ádios
Vì các ký tự <, > và & có ý nghĩa đặc biệt trong HTML, chúng đợc xem là các “siêu ký
tự” và không thể hiển thị trực tiếp trên màn hình trình duyệt Mặt khác, chúng cũngkhông thể đợc “bẫy” nh cách thức trong UNIX (tức là sử dụng một siêu ký tự đi kèmmột siêu ký tự khác để chỉ ký tự đó là ký tự thờng) Các siêu ký tự trong HTML đợc kếthợp bằng cách sử dụng phơng thức &string
5.4 Sử dụng màu sắc trong thiết kế các trang Web
Một màu đợc tổng hợp từ ba thành phần màu chính, đó là: Đỏ (Red), Xanh lá cây(Green), Xanh nớc biển (Blue) Trong HTML một giá trị màu là một số nguyên dạnghexa (hệ đếm cơ số 16) có định dạng nh sau:
#RRGGBB
trong đó:
Trang 22RR - là giá trị màu Đỏ.
GG - là giá trị màu Xanh lá cây
BB - là giá trị màu Xanh nớc biển
Màu sắc có thể đợc xác định qua thuộc tính bgcolor= hay color= Sau dấu bằng có thể làgiá trị RGB hay tên tiếng Anh của màu Với tên tiếng Anh, ta chỉ có thể chỉ ra 16 màutrong khi với giá trị RGB ta có thể chỉ tới 256 màu
Sau đây là một số giá trị màu cơ bản:
YELLOWLIGHTYELLOWWHITE
BLACKGRAYBROWNMAGENTAVIOLETPINKORANGENAVYROYALBLUEAQUAMARINE
Chúng ta có thể sử dụng các giá trị màu nói trên để quy định màu chữ, màu nền chotrang Web của mình Dới đây là cú pháp đầy đủ của thẻ BODY cho phép chúng ta đặt
ảnh nền, màu nền, màu chữ, màu văn bản siêu liên kết hay đặt lề cho trang Web
Trang 23LINK Chỉ định màu của văn bản siêu liên kết
ALINK Chỉ định màu của văn bản siêu liên kết đang đang chọn VLINK Chỉ định màu của văn bản siêu liên kết đã từng mở BACKGROUND Chỉ định địa chỉ của ảnh dùng làm nền
TEXT Chỉ định màu của văn bản trong tài liệu
SCROLL YES/NO - Xác định có hay không thanh cuộn
Text color: YELLOW<BR>
Background color: ROYALBLUE
Trang 24Ví dụ 5.6:
Trong ví dụ này, chúng ta sẽ sử dụng tệp ảnh
bground1.gif để làm nền cho trang Web của mình.
</BODY>
</HTML>
Sau khi duyệt sẽ đợc kết quả:
Trang 255.5 Chọn kiểu chữ cho văn bản
Để có đợc một trang Web đẹp ngoài các công việc nh thiết kế bố cục, trang trí màu sắc,hình ảnh thì việc lựa chọn các kiểu chữ phù hợp cho từng nội dung văn bản cần trìnhbày cũng rất quan trọng Để chọn phông chữ hiển thị cho một văn bản bạn có thể sửdụng thẻ FONT (tuy nhiên để trình duyệt có thể hiển thị đúng phông chữ quy định thìyêu cầu hệ thống phải đợc cài đặt phông chữ đó)
Trang 265.6 Khái niệm văn bản siêu liên kết
Văn bản siêu liên kết hay còn gọi là siêu văn bản là một từ, một cụm từ hay một câu trêntrang Web đợc dùng để liên kết tới một trang Web khác Khi chúng ta nhấn chuột lênmột siêu văn bản, lập tức trình duyệt Web sẽ cho mở trang Web đợc liên kết với siêu vănbản đó Thông thờng các siêu văn bản sẽ có màu sắc phân biệt với các văn bản bình th-ờng (chúng ta có thể chỉ định màu sắc này) và đợc gạch chân, khi con chuột di chuyểntrên một siêu văn bản nó sẽ có hình dạng một bàn tay
Siêu văn bản là môi trờng trong đó chứa các liên kết (link) của các thông tin Do WWWcấu thành từ nhiều hệ thống khác nhau, cần phải có một quy tắc đặt tên thống nhất chotất cả các văn bản trên Web Quy tắc đặt tên đó là URL (Universal Resource Locator)
Các thành phần của URL đợc minh hoạ ở hình trên
Dịch vụ: Là thành phần bắt buộc của URL Nó xác định cách thức trình duyệt của
máy khách liên lạc với máy phục vụ nh thế nào để nhận dữ liệu Có nhiều dịch vụ nh
http, wais, ftp, gopher, telnet
Tên hệ thống : Là thành phần bắt buộc của URL Có thể là tên miền đầy đủ của
máy phục vụ hoặc chỉ là một phần tên đầy đủ – trờng hợp này xảy ra khi văn bản đợcyêu cầu vẫn nằm trên miền của bạn Tuy nhiên nên sử dụng đờng dẫn đầy đủ
Cổng : Không là thành phần bắt buộc của URL Cổng là địa chỉ socket của mạng
dành cho một giao thức cụ thể Giao thức http ngầm định nối với cổng 8080
Đ ờng dẫn th mục : Là thành phần bắt buộc của URL Phải chỉ ra đờng dẫn tới file
yêu cầu khi kết nối với bất kỳ hệ thống nào Có thể đờng dẫn trong URL khác với đờng
http://selab.vnuh.edu.vn:8080 /~dir1/dir2/dir3/index.HTML#chapter001 Dịch vụ
Trang 27dẫn thực sự trong hệ thống máy phục vụ Tuy nhiên có thể rút gọn đờng dẫn bằng cách
đặt biệt danh (alias) Các th mục trong đờng dẫn cách nhau bởi dấu gạch chéo (/)
Tên file : Không là thành phần bắt buộc của URL Thông thờng máy phục vụ đợc cấu
hình sao cho nếu không chỉ ra tên file thì sẽ trả về file ngầm định trên th mục đợc yêucầu File này thờng có tên là index.html, index.htm, default.html hay default.htm Nếucũng không có các file này thì thờng kết quả trả về là danh sách liệt kê các file hay thmục con trong th mục đợc yêu cầu
Các tham số : Không là thành phần bắt buộc của URL Nếu URL là yêu cầu tìm
kiếm trên một cơ sở dữ liệu thì truy vấn sẽ gắn vào URL, đó chính là đoạn mã đằng saudấu chấm hỏi (?).URL cũng có thể trả lại thông tin đợc thu thập từ form Trong trờnghợp dấu thăng (#) xuất hiện đoạn mã đăng sau là tên của một vị trí (location) trong file
TABLEINDEX Thứ tự di chuyển khi ấn phím Tab
TITLE Văn bản hiển thị khi di chuột trên siêu liên kết.
TARGET Mở trang Web đợc liên trong một cửa sổ mới (_blank) hoặc
trong cửa sổ hiện tại (_self), trong một frame (tên frame).
Trang 28URL đợc trình bày ở trên là URL tuyệt đối Ngoài ra còn có URL tơng đối hay còn gọi
là URL không đầy đủ Địa chỉ tơng đối sử dụng sự khác biệt tơng đối giữa văn bản hiệnthời và văn bản cần tham chiếu tới Các thành phần trong URL đợc ngăn cách bằng ký tựngăn cách (ký tự gạch chéo /) Để tạo ra URL tơng đối, đầu tiên phải sử dụng ký tự ngăncách URL đầy đủ hiện tại sẽ đợc sử dụng để tạo nên URL đầy đủ mới Nguyên tắc làcác thành phần bên trái dấu ngăn cách của URL hiện tại đợc giữ nguyên, các thành phầnbên phải đợc thay thế bằng thành phần URL tơng đối Chú ý rằng trình duyệt không gửiURL tơng đối, nó bổ sung vào URL cơ sở đã xác định trớc thành phần URL tơng đốixác định sau thuộc tính href= Ký tự đầu tiên sau dấu bằng sẽ xác định các thành phầnnào của URL hiện tại sẽ tham gia để tạo nên URL mới
Ví dụ, nếu URL đầy đủ là: http://it-department.vnuh.edu.vn/HTML/index.htm thì:
Dấu hai chấm ( : ) chỉ dịch vụ giữ nguyên nhng thay đổi phần còn lại Ví dụ
://www.fpt.com/ sẽ tải trang chủ của máy phục vụ www.fpt.com với cùng dịch vụhttp
Dấu gạch chéo ( / ) chỉ dịch vụ và máy phục vụ giữ nguyên nhng toàn bộ đờng
dẫn thay đổi Ví dụ /Javascript/index.htm sẽ tải file index.htm của th mục
Javascript trên máy phục vụ www.it-department.vnuh.edu.vn
Không có dấu phân cách chỉ có tên file là thay đổi Ví dụ index1.htm sẽ tải
file index1.htm ở trong th mục HTML của máy phục vụ department.vnuh.edu.vn
www.it- Dấu thăng ( # ): chỉ dịch vụ, máy phuc vụ, đờng dẫn và cả tên file giữ nguyên,
chỉ thay đổi vị trí trong file