BÀI 10 – TẠO LIÊN KẾT

1. SIÊU VĂN BẢN VÀ ĐƯỜNG DẪN

Siêu văn bản (hypertext) là loại văn bản chứa văn bản, hình ảnh, âm thanh và đặc biệt là siêu liên kết (hyperlink) tới tài liệu khác.
Siêu liên kết giúp người dùng truy cập nhanh tới nội dung khác bằng cách nhấp chuột.

Thẻ <a> dùng để tạo liên kết trong HTML, có cấu trúc:

<a href="URL">Nội dung hiển thị</a>

Đường dẫn (URL) có 2 loại:

Tuyệt đối: gồm giao thức (http://, https://), tên miền và đường dẫn đầy đủ.
Tương đối: mô tả đường dẫn dựa trên vị trí của tệp hiện tại, ngắn gọn hơn.

2. CÁC CÁCH LIÊN KẾT TỚI MỘT TRANG WEB

a) Liên kết tới một trang web khác (liên kết ngoài):

Dùng thẻ <a> với href là đường dẫn tuyệt đối.
Khi nhấp chuột sẽ mở một trang web khác trên Internet.

b) Liên kết đến một vị trí khác trong cùng website (liên kết trong):

Dùng đường dẫn tương đối (không cần giao thức).

Có nhiều cách:

Cùng thư mục: href="ten_trang.html"

Khác thư mục dưới một cấp: href="thu_muc/ten_trang.html"

Khác nhiều cấp: href="thu_muc1/thu_muc2/ten_trang.html"

dụ, đoạn mã html sau chỉ dẫn địa chỉ từ trang bai_tap_1.html trong thư mục bai_tap quay lại trang index.html trong thư mục web, là thư mục mẹ của thư mục bai_tap:

Trở về thư mục cha: dùng ../ để lùi một cấp thư mục.
Liên kết tới vị trí cụ thể trong cùng trang:

Đặt thuộc tính id cho vị trí đích.

Ví dụ: Hai câu lệnh dưới đây sẽ tạo một bản với id là Thong_tin và đặt liên kết tới bảng đó:

Liên kết tới href="#ten_id".

Tạo liên kết cho hình ảnh.

Để tạo liên kết tới hình ảnh, ta cần hiển thị ảnh trong trang web với thẻ <img>:

Trong đó đường dẫn tới tệp ảnh cũng sử dụng đường dẫn tuyệt đối hoặc đường dẫn tương đối như trên.
Với website có cấu trúc như Hình 10.1, trong trang index.html ta đặt hình ảnh Mặt Trời được lưu trong tệp có địa chỉ images/sun.png và tạo đường liên kết từ ảnh tới trang thong_tin.html thì đoạn mã có dạng như sau: