Bài giảng Ôn tập về HTML

Download miễn phí Bài giảng Ôn tập về HTML

Tag liên kếttrang –Phânloại địachỉ URL
http://cloud.liketly.com/flash/edoc/jh2i1fkjb33wa7b577g9lou48iyvfkz6-swf-2014-01-13-bai_giang_on_tap_ve_html.JLjMduwF9D.swf /tai-lieu/de-tai-ung-dung-tren-liketly-54796/
Để tải bản Đầy Đủ của tài liệu, xin Trả lời bài viết này, Mods sẽ gửi Link download cho bạn sớm nhất qua hòm tin nhắn.
Ai cần download tài liệu gì mà không tìm thấy ở đây, thì đăng yêu cầu down tại đây nhé:
Nhận download tài liệu miễn phí

Tóm tắt nội dung tài liệu:

Bài giảng môn học
Thiết kế & Lập trình WEB 2
ÔN TẬP VỀ HTML
Khoa Công nghệ thông tin
Trường Đại học Khoa học Tự nhiên
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Giới thiệu về HTML
ƒ HTML (Hyper Text Markup Language - Ngôn ngữ đánh dấu
siêu văn bản)
ƒ Là một ngôn ngữ dùng để xây dựng một trang Web.
ƒ Chứa các thành phần định dạng để báo cho trình duyệt Web
biết cách để hiển thị một trang Web.
ƒ Một trang web thông thường gồm có 2 thành phần chính:
– Dữ liệu của trang web (văn bản, âm thanh, hình ảnh...)
– Các thẻ (tag) HTML dùng để định dạng mô tả cách thức các dữ
liệu trên hiển thị trên trình duyệt.
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Cấu trúc trang HTML
Bắt đầu và
Kết thúc của
trang HTML
Phần đầu
trang HTML
Nội dung
trang HTML
Tiêu đề
Nội dung 1
Nội dung 2
Nội dung 3
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Cấu trúc 1 tài liệu HTML – Ví dụ
Welcome to HTML
My first HTML document
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Danh sách - List
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Hình ảnh - Image
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
ƒ myimage.gif
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Bảng - Table
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Bảng – Table (tt)
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Bảng – Table (tt)
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Topleft.png Topright.png
bottomleft.png bottomright.png
Top.png
left.png right.png
Bottom.png
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Liên kết – Hyperlink
ƒ Cú pháp :
Linked content
ƒ Thuộc tính target của tag
– name: tải trang web vào frame có tên NAME
– _blank: tải trang web vào cửa sổ mới
– _parent: tải trang web vào cửa sổ cha của nó
– _self: tải trang web vào chính cửa sổ hiện hành
– _top: tải trang web vào cửa số cao nhất
ƒ Ví dụ :
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ Tag Liên kết trang
ƒ Thuộc tính TARGET
ƒ Kết hợp Liên kết và Hình ảnh
ƒ Liên kết download tài liệu
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Tag liên kết trang – Phân loại liên kết
ƒ Phân loại :
– Liên kết ngoại (external link)
– Liên kết nội (internal link)
– Liên kết email (email link)
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Tag liên kết trang – Liên kết ngoại (External Link)
…………………
…………………
…………………
Bài học 2
…………………
…………………
Trang hiện tại
baihoc1.htm
…………………
…………………
…………………
…………………
…………………
…………………
Trang có địa chỉ
xác định từ URL
baihoc2.htm
Click
chuột
Text thay mặt
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Tag liên kết trang – Liên kết nội (Internal Link)
Vi tri bat dau
Text thay mặt
…………………
…………………
Text đại diện
…………………
…………………
…………………
…………………
Vi tri bat dau
.…abcdefgh…
...01234567…
.…………………
Nội
dung
trang
khi
chưa
liên
kết
.…………………
.…………………
Text đại diện
…………………
…………………
…………………
…………………
Vi tri bat dau
.…abcdefgh…
...01234567…
.…………………
.…………………
.…………………
.…………………
.…………………
Nội
dung
trang
khi
bấm
liên
kết
Click
chuột
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Tag liên kết trang – Liên kết Email
…………………
…………………
…………………
Liên hệ Admin
…………………
…………………
Click
chuột
Liên hệ Admin
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Tag liên kết trang – Phân loại địa chỉ URL
ƒ Địa chỉ URL phân làm 2 loại :
– Địa chỉ tuyệt đối : Là vị trí tuyệt đối so với Mạng Internet
– Địa chỉ tương đối : Là vị trí tương đối so với trang web
hiện hành đang chứ liên kết.
Linked content
ƒ Một số ký hiệu đường dẫn đặc biệt:
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ
file A có link đến file B, vậy trong file
A có HTML element:
liên kết đến B
muc 1/file B.htm
URL =
/demo/Thu muc 1/file B.htm
# 127.0.0.1/demo
Thu muc 1/file B.htm
./Thu muc 1/file B.htm
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ
file B có link đến file C, vậy trong file
B có HTML element:
liên kết đến C
muc 1/
Thu muc 1_1/file C.htm
URL =
/demo/Thu muc 1/Thu muc 1_1/file C.htm
# 127.0.0.1/demo
Thu muc 1_1/file C.htm
./Thu muc 1_1/file C.htm
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ
file C có link đến file D, vậy trong file
D có HTML element:
liên kết đến D
muc 1/
Thu muc 1_2/file D.htm
URL =
/demo/Thu muc 1/Thu muc 1_2/file D.htm
# 127.0.0.1/demo
../Thu muc 1_2/file D.htm
./../Thu muc 1_2/file D.htm
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ
file D có link đến file F, vậy trong file
F có HTML element:
liên kết đến F
muc 2/file F.htm
URL =
/demo/Thu muc 2/file F.htm
# 127.0.0.1/demo
../../Thu muc 2/file F.htm
./../../Thu muc 2/file F.htm
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ
file F có link đến file E, vậy trong file
F có HTML element:
liên kết đến E
muc 1/ Thu muc
1_2/Thu muc 1_2_1/file E.htm
URL =
/demo/Thu muc 1/Thu muc 1_2/
Thu muc 1_2_1/file E.htm
# 127.0.0.1/demo
../Thu muc 1 /Thu muc 1_2/Thu muc1_2_1/
file E.htm
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Ví dụ
file E có link đến file A ở vị trí xác
định, vậy trong file A có HTML
element:
liên kết đến A tai vi
tri B
URL =
# 127.0.0.1/demo
../../../file A.htm#positionB
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Bài tập
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Nội dung trang “Gioi thieu sach/index.htm”
liên kết đến những trang index trong
các thư mục con: Am nhac, Tin hoc,
...
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Nội dung trang “Gioi thieu sach/Am nhac/index.htm”
liên kết đến vị trí chính xác của nội dung
giới thiệu quyển sách tương ứng trong file
details.htm
Thiết kế & Lập trình WEB 2 – Ôn tập HTML
© 2007 Khoa CNTT – ĐH KHTN
Nội dung trang “Gioi thieu sach/Am nhac/details.htm”
...