Tài liệu Giới thiệu và siêu liên kết doc

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (313.02 KB, 22 trang )

Giới thiệu và siêu liên kết
Chương 1
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 2 of 22
Mục tiêu bài học

Khái quát về Internet

Khái quát về HTML

Viết một tài liệu HTML đơn giản

Sử dụng siêu liên kết trong tài liệu HTML

Sử dụng thẻ <META>

Sử dụng các ký tự đặc biệt trong tài liệu
HTML
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 3 of 22
World Wide Web

Internet là mạng máy tính lớn nhất trên thế
giới

Internet được xem là mạng của các mạng

World Wide Web là một tập con của

Internet

World Wide Web gồm các Web Servers có
mặt khắp mọi nơi trên thế giới
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 4 of 22
Giới thiệu HTML

HTML là một ngôn ngữ đánh dấu

Sử dụng các thẻ và các phần tử HTML, ta có
thể :

Điều khiển hình thức và nội dung của trang

Xuất bản các tài liệu trực tuyến và truy
xuất thông tin trực tuyến bằng cách chèn
các liên kết vào tài liệu HTML

Tạo các biểu mẫu trực tuyến để thu thập
thông tin về người dùng, quản lý các giao
dịch
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 5 of 22
Cú pháp HTML
<HTML>
<HEAD>
<TITLE>Welcome to HTML</TITLE>

<HEAD>
<BODY>
<H3>My first HTML document</H3>
</BODY>
</HTML>
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 6 of 22
Hiển thị trang
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 7 of 22
Trình duyệt và trình soạn thảo

Trình duyệt

Netscape's Navigator

Microsoft's Internet Explorer

Trình soạn thảo

Microsoft FrontPage

Notepad
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 8 of 22
Các thẻ HTML


Thẻ HTML được sử dụng để đánh dấu sự bắt
đầu và kết thúc của tài liệu HTML
<HTML> . . . </HTML>

Một thẻ HTML bao gồm :
<ELEMENT ATTRIBUTE = value>

Element – Nhận dạng thẻ

Attribute – Mô tả thẻ

Value – Giá trị được thiết lập cho thuộc tính
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 9 of 22
Cấu trúc của một tài liệu HTML
<HTML>
<HEAD>
<TITLE>Welcome to the world of HTML</TITLE>
</HEAD>
<BODY>
<P>This is going to be real fun</P>
</BODY>
</HTML>

Phần HTML

Phần tiêu đề

Phần thân

Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 10 of 22
Đoạn
<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>
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 11 of 22
Thẻ ngắt
<HTML>
<HEAD>
<TITLE>Welcome to HTML</TITLE>
</HEAD>
<BODY BGCOLOR = lavender>
<P>This is going to be real fun
<BR>
<P> Another paragraph element
</BODY>
</HTML>
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 12 of 22

Canh lề cho văn bản
Giá trị Mô tả
Left Văn bản được canh lề trái
Center Văn bản được canh giữa
Right Văn bản được canh phải
Justify Văn bản được canh đều hai bên
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 13 of 22
Sử dụng các ký tự đặc biệt

Lớn hơn (>)

>

Nhỏ hơn (<)

<

Trích dẫn (“ “)

"

Ký tự & (&)

&
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 14 of 22
Siêu liên kết

Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 15 of 22
Giới thiệu siêu liên kết

Các dạng liên kết

Liên kết trong là liên kết đến các phần
trong cùng tài liệu hoặc cùng một web site

Liên kết ngoài là liên kết đến các trang
trên các web site khác hoặc máy chủ khác.
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 16 of 22
Liên kết trong và liên kết ngoài
- - - - -
- -
- - - - -
- -
- - - - -
- -
- - - - -
- -
- - - - -
- -
- - - - -
- -
- - - - -
- -

- - - - -
- -
- - - - -
- -
- - - - -
- -
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 17 of 22
Tạo siêu liên kết

Để tạo siêu liên kết, chúng ta cần phải xác định hai
thành phần :

Địa chỉ đầy đủ hoặc URL của file được kết nối

Điểm nóng cung cấp cho liên kết. Điểm nóng này có thể là
một dòng văn bản hoặc thậm chí là một ảnh.

Các kiểu URL

URL tuyệt đối

URL tương đối
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 18 of 22
HREF

Cú pháp của HREF là :

<A HREF =
protocol://host.domain:port/path/filename>
Hypertext </A>

Protocol xác định loại giao thức

Host.domain là địa chỉ Internet của máy chủ

Port là cổng phục vụ của máy chủ đích

HyperText là văn bản hay hình ảnh mà user
cần nhấp vào để kích hoạt liên kết
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 19 of 22
Liên kết

Liên kết đến tài liệu khác

Đường dẫn tuyệt đối

Đường dẫn tương đối

Liên kết đến các phần trong cùng một tài liệu

Liên kết đến một điểm xác định ở một tài liệu
khác

Sử dụng e-mail
Web Page Programming with

HTML,DHTML &
JavaScript/Session 1/ 20 of 22
Điều hướng quanh Web Site

Trình bày tuyến tính

Trình bày theo phân cấp

Bản đồ ảnh

Siêu liên kết

Các trang con

Bảng mục lục

Nút
Back
and
Forward
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 21 of 22
Trình bày tuyến tính
- - - - - - - - - -
- - - - - - - - - -
- - - - - -
- - - - - - - - - -
- - - - - - - - - -
- - - - - -

- - - - - - - - - -
- - - - - - - - - -
- - - - - -
- - - - - - - - - -
- - - - - - - - - -
- - - - - -

Theo cấu trúc tuyến tính

Một chuỗi liên kết liên tục giữa các trang
Web Page Programming with
HTML,DHTML &
JavaScript/Session 1/ 22 of 22
Trình bày theo phân cấp

Trang chủ liên kết với nhiều trang khác

Mỗi trang đều có liên kết về trang chủ.
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -

- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -
- - - - - - - - -

Tài liệu Giới thiệu và siêu liên kết doc

Tài liệu liên quan

Tài liệu bạn tìm kiếm đã sẵn sàng tải về