Liên kết HTML – Cú pháp
Thẻ <a> trong HTML xác định một siêu liên kết. Nó có cú pháp sau:
| <a href=”url“>Link liên kết</a> |
Thuộc tính quan trọng nhất của <a> phần tử là hrefthuộc tính, nó cho biết đích của liên kết.
Các văn bản liên kết là phần mà sẽ được hiển thị cho người đọc.
Nhấp vào văn bản liên kết, sẽ đưa người đọc đến địa chỉ URL được chỉ định.
Ví dụ:
| <a href=”https://doanvanhai24h.biz/category/lap-trinh/website/“>Học HTML cơ bản</a> | Học HTML cơ bản |
Theo mặc định, các liên kết sẽ xuất hiện như sau trong tất cả các trình duyệt:
- Một liên kết không được truy cập được gạch chân và màu xanh lam
- Một liên kết đã truy cập được gạch chân và có màu tím
Liên kết HTML – Thuộc tính mục tiêu
Theo mặc định, trang được liên kết sẽ được hiển thị trong cửa sổ trình duyệt hiện tại. Để thay đổi điều này, bạn phải chỉ định một mục tiêu khác cho liên kết.
Các targetquy định cụ thể thuộc tính nơi để mở tài liệu được liên kết.
Các targetthuộc tính có thể có một trong các giá trị sau:
_self– Mặc định. Mở tài liệu trong cùng một cửa sổ / tab khi nó được nhấp vào_blank– Mở tài liệu trong cửa sổ hoặc tab mới_parent– Mở tài liệu trong khung chính_top– Mở tài liệu trong toàn bộ phần thân của cửa sổ
Ví dụ:
Sử dụng target = “_ blank” để mở tài liệu được liên kết trong tab hoặc cửa sổ trình duyệt mới:
| <a href=”https://doanvanhai24h.biz/category/lap-trinh/website/” target=”_blank”>Học lập trình websie</a> |
URL tuyệt đối so với URL tương đối
Cả hai ví dụ trên đều đang sử dụng URL tuyệt đối (địa chỉ web đầy đủ) trong href thuộc tính.
Liên kết cục bộ (liên kết đến một trang trong cùng một trang web) được chỉ định bằng URL tương đối (không có phần “https: // www”):
Ví dụ:
| <h2>URL tuyệt đối</h2> <p><a href=”https://doanvanhai24h.biz/”>doanvanhai</a></p> <p><a href=”https://www.google.com/”>Google</a></p> <h2>URL tương đối</h2> |
Liên kết HTML – Sử dụng Hình ảnh làm Liên kết
Để sử dụng hình ảnh làm liên kết, chỉ cần đặt thẻ <img> bên trong thẻ <a>
Ví dụ:
| <a href=”html.asp”> <img src=”anh.png” alt=”HTML cơ bản” style=”width:42px;height:42px;”> </a> |
Liên kết đến một địa chỉ Email
Sử dụng mailto:bên trong hrefthuộc tính để tạo liên kết mở chương trình email của người dùng (để cho phép họ gửi email mới)
Ví dụ:
| <a href=”mailto:hochtml@gmail.com”>Gửi mail</a> |
Tiêu đề liên kết ( Thẻ title )
Các title thuộc tính xác định thông tin thêm về một phần tử. Thông tin thường được hiển thị dưới dạng văn bản chú giải công cụ khi chuột di chuyển qua phần tử.
Ví dụ:
| <a href=”https://doanvanhai24h.biz/” title=“Học HTML cơ bản”>Học HTML cơ bản</a> |
Tóm tắt Bài 4
| <a> | phần tử để xác định một liên kết |
| href | thuộc tính để xác định địa chỉ liên kết |
| target | thuộc tính để xác định nơi mở tài liệu được liên kết |
| <img> | phần tử (bên trong <a>) để sử dụng hình ảnh làm liên kết |
| mailto: | lược đồ bên trong hrefthuộc tính để tạo liên kết mở chương trình email của người dùng |
( Các thẻ liên kết
Các thẻ liên kết )
[…] <img> trong HTML được sử dụng để nhúng hình ảnh vào một trang […]