Liên kết, đường dẫn tuyệt đối, đường dẫn tương đối trong HTML

1. Liên kết là gì?

Liên kết được dùng để chuyển sang một trang web khác (hoặc một nguồn tài nguyên khác như: hình ảnh, video, file nhạc,....). Liên kết có thể được đại diện bởi văn bản hoặc hình ảnh.

2. Cách tạo một liên kết

Để tạo một liên kết, ta sử dụng cú pháp dưới đây:

Trong đó: URL là địa chỉ của trang web mà bạn muốn chuyển đến khi người dùng bấm vào liên kết. Kiểu mở liên kết có thể là:

_blank: Mở liên kết trên một tab mới

_self: Mở liên kết ở ngay tab hiện tại (Mặc định là liên kết sẽ được mở ở ngay tab hiện tại)

Ví dụ:

3. Đường dẫn tuyệt đối, đường dẫn tương đối

Một liên kết được xác định bởi một đường dẫn (đường dẫn hay còn được biết đến như một địa chỉ trang web). Đường dẫn được chia làm hai loại:

1. Đường dẫn tuyệt đối (là một chuỗi đầy đủ bao gổm http://, tên miền của trang web, đường dẫn đến tập tin). Ưu điểm : Dễ dàng xác định được đường dẫn đến một trang web (hoặc tài nguyên) nào đó. Nhược điểm: Không thể sử dụng cho các tên miền khác. Ví dụ, bạn đang xem bài hướng dẫn này ở trang http://labanvn.wap.sh, tôi có một liên kết đến trang Hướng dẫn tạo một trang web HTML với đường dẫn là http://labanvn.wap.sh/html/huong-dan.html. Nếu tôi up toàn bộ mã nguồn của trang web này cho tên miền http://utnhan.wap.sh thì khi bấm vào liên kết Hướng dẫn tạo một trang web HTML nó vẫn chuyển đến trang http://labanvn.wap.sh/html/huong-dan.html chứ không phải là http://haychiase.uiwap.com/html/huong-dan.html. Ví dụ:

https://sites.google.com/site/utnhanphan/home/wapmaster/html

https://sites.google.com/site/utnhanphan/home/wapmaster/html/tong-quan-ve-html

https://sites.google.com/site/utnhanphan/home/wapmaster/html/cach-tao-mot-trang-web-html

2. Đường dẫn tương đối (là một phần nhỏ của đường dẫn tuyệt đối, thông thường đường dẫn tương đối là phần đường dẫn đến tập tin). Ưu điểm: Có thể sử dụng trên các tên miền khác nhau. Nhược điểm: Nếu chưa quen cách sử dụng đường dẫn tương đối thì việc xác định đường dẫn đến một trang web (hoặc tài nguyên) nào đó sẽ rất khó khăn và dễ bị sai. Ví dụ:

/home/wapmaster/html

/wapmaster/html/tong-quan-ve-html

/wapmaster/html/cach-tao-mot-trang-web-html

Ví dụ:

Hai liên kết dưới đây đều được dùng để chuyển đến trang https://sites.google.com/site/utnhanphan/home/wapmaster/html. Tuy nhiên cách viết đường dẫn thì khác nhau.

<a href="https://sites.google.com/site/utnhanphan/home/wapmaster/html">Đường dẫn tuyệt đối</a>

<a href="/home/wapmaster/html">Đường dẫn tương đối</a>

4. Liên kết trong

Liên kết trong là liên kết đến vị trí của một phần tử nào đó nằm trong trang web. Để xác định vị trí cho một phần tử ta phải thêm thuộc tính id vào thẻ mở của phần tử đó. Ví dụ:

<h2 id="chuong1">CHƯƠNG SỐ 1</h2>

Để liên kết đến vị trí của một phần tử, ta sử dụng cú pháp

Ví dụ

<a href="#chuong2">Xem chương 2</a><br>

<a href="#chuong3">Xem chương 3</a><br>

<a href="#chuong4">Xem chương 4</a>

<h2>CHƯƠNG SỐ 1</h2>

<p>Đây là nội dung của chương số 1</p>

<h2 id="chuong2">CHƯƠNG SỐ 2</h2>

<p>Đây là nội dung của chương số 2</p>

<h2>CHƯƠNG SỐ 3</h2>

<p>Đây là nội dung của chương số 3</p>

<h2 id="chuong4">CHƯƠNG SỐ 4</h2>

<p>Đây là nội dung của chương số 4</p>

5. Dùng hình ảnh làm đại diện cho liên kết

Để dùng hình ảnh làm đại diện cho một liên kết, ta sử dụng cú pháp sau:

Trong đó, URL1 là địa chỉ của trang web mà bạn muốn chuyển đến khi người dùng bấm vào hình ảnh liên kết. URL2 là đường dẫn đến tập tin hình ảnh dùng làm đại diện cho liên kết. Tương tự như URL1, URL2 có thể được xác định bằng đường dẫn tuyệt đối hoặc đường dẫn tương đối. Khi thực thi đoạn mã:

<br>

Google Sites

Report abuse