HTML Links - Tạo siêu liên kết (hyperlinks) trong HTML

Xin chào mọi người, rất xin lỗi vì lâu rồi mình mới lại viết về Tự học lập trình. Ở bài viết trước, mình đã giới thiệu cho các bạn biết cơ bản về HTML, rồi các thẻ cũng như thuộc tính của thẻ trong HTML Bắt đầu từ hôm nay, mình sẽ đi sâu hơn về một số thẻ quan trọng mà chúng ta bắt buộc phải nhớ nếu như muốn tự học HTML.

Hôm nay, mình xin giới thiệu đến thẻ A (Anchor tag) - một thẻ không thể thiếu trong HTML.
Mục đích chính của thẻ a đương nhiên là giúp người dùng có thể tương tác với website thông qua chuột (click chuột). Tương tác ở đây là có thể đưa người đọc/xem website đến một liên kết bên trong trang web hoặc ngoài trang. ( ở Blogspot, các bạn có thể dễ dàng nhìn thấy link xuất hiện ở các tiêu đề bài viết, tôi tạo ra thẻ liên kết đó thì bạn mới vào đọc được bài viết này ^^)
Nói chung lại, nếu không có thẻ liên kết a thì cũng chẳng có Google, Yahoo hay Blogger, Dantri,... nào cả.

Nhận biết thẻ a?
Một cặp thẻ <a>Nội_dung_liên_kết</a> định nghĩa cho trình duyệt một liên kết.

Đây là một ví dụ liên kết

 - Nội dung liên kết có thể là từ, cụm từ hay đoạn văn, hình ảnh, video.
 - Khi bạn di chuyển chuột qua một thẻ a, điều dễ nhận biết là con trỏ chuột sẽ biến thành bạn tay nhỏ.
 - Thông thường thẻ a có đường gạch chân dưới nội dung liên kết.

Cú pháp khai báo thẻ liên kết:

<a href="liên_kết_đối_tượng">Nội_dung_hiển_thị_cho_người_xem</a>
hoặc tương tự:
<a href="http://google.com.vn" target="_blank">Google Việt Nam</a>

 *Thuộc tính:
- href: bắt buộc phải có bởi vì có nó mới có đường dẫn cần trỏ tới
- target: thuộc tính này quy định liên kết được mở ra ở đâu, có các giá trị:

• _blank: mở trang web ở cửa sổ hay tab mới
• _seft: mở ở cửa sổ hiện tại mặc định khi không có thuộc tính target thì thẻ <a> sẽ mở ở cửa sổ hiện tại.

HTML Links - Thuộc tính name và id:
Cấu trúc:

- Bước đặt tên:
 <a name="muc-1">Đây là mục 1</a>

<a id="muc-1">Đây là ID mục 1</a>

- Bước tạo liên kết:
 <a href="#muc-1">Di chuyển đến mục 1</a>

Xem ví dụ
Hai thuộc tính này có chức năng theo mình nghĩ là tương tự nhau, đều dùng để đặt tên cho một phần tử của trang, sau đó tạo đường dẫn để dẫn người đọc đến đúng phần tử đó. Đây là thuộc tính hay, giúp người đọc có thể quay lại một mục nào đó nhanh chóng.

Liên kết đa phương tiện:

- Sử dụng ảnh làm liên kết:
<a href="http://www.google.com.vn" target="_bank"><img src="google.png"></a>
Xem ví dụ:

- Liên kết đến âm thanh, đoạn nhạc:
<a href="doan-nhac-cua-toi.mp3">Nghe nhạc của tôi</a>

Ví dụ: Tải bài nhạc

- Liên kết đến Đoạn phim:
<a href="video-cua-toi.avi"></a>

Ví dụ: Tải đoạn phim

Cảm ơn các bạn đã đọc bài viết, bài viết tiếp theo mình sẽ giới thiệu thẻ TABLE (tạo bảng).

theo Trường Anh