THẺ HTML - <a>

Ví dụ

Tạo liên kết đến website book-code.com.vn

<a href="https://www.book-code.com.vn/">Visit book-code.com.vn!</a>

Xem kết quả

Xem thêm các ví dụ bên dưới.

Định nghĩa và cách sử dụng


Thẻ <a> xác định một siêu liên kết, được sử dụng để liên kết từ trang này sang trang khác.

Thuộc tính quan trọng nhất của phần tử <a> là thuộc tính href.Nó xác định điểm đến của liên kết.

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à có màu xanh
  • Một liên kết đã truy cập được gạch chân và có màu tím
  • Một liên kết đang hoạt động được gạch chân và có màu đỏ

Lưu ý

Nếu thẻ <a> không có thuộc tính href, nó chỉ là một thẻ giữ chỗ cho một siêu liên kết.

Một trang được liên kết đến thường được hiển thị trong cửa sổ trình duyệt hiện tại, trừ khi chúng ta chỉ định một mục tiêu khác.

Sử dụng CSS để tạo kiểu cho liên kết: CSS LinksCSS Button.

Hỗ trợ trình duyệt


Element          
<a> Yes Yes Yes Yes Yes

Thuộc tính


Attribute Value Description
download filename Chỉ định đối tượng sẽ được tải xuống khi người dùng nhấp vào siêu liên kết
href URL Chỉ định URL của trang mà liên kết chuyển đến
hreflang language_code Chỉ định ngôn ngữ của tài liệu được liên kết
media media_query Chỉ định phương tiện/ thiết bị nào mà tài liệu được liên kết sẽ được tối ưu hóa
ping list_of_URLs Chỉ định danh sách URL được phân tách bằng dấu cách mà khi liên kết được theo sau, các yêu cầu với nội dung ping sẽ được gửi bởi trình duyệt. Thường được sử dụng để kiểm tra kết nối.
referrerpolicy no-referrer
no-referrer-when-downgrade
origin
origin-when-cross-origin
same-origin
strict-origin-when-cross-origin
unsafe-url
Chỉ định thông tin giới thiệu nào cần được gửi cùng với liên kết
rel alternate
author
bookmark
external
help
license
next
nofollow
noreferrer
noopener
prev
search
tag
Chỉ định mối quan hệ giữa tài liệu hiện tại và tài liệu được liên kết
target _blank
_parent
_self
_top
Chỉ định nơi để mở tài liệu được liên kết
type media_type Chỉ định loại phương tiện của tài liệu được liên kết

Một số ví dụ


Sử dụng hình ảnh làm liên kết.

Ví dụ

<a href="https://www.book-code.com.vn/">
<img border="0" alt="book-code" src="logo-bookcode.png" width="100" height="150">
</a>

Xem kết quả

Mở liên kết trong một trình duyệt mới.

Ví dụ

<a href="https://www.book-code.com.vn/" target="_blank">Website book-code.com.vn!</a>

Xem kết quả

Mở liên kết đến một địa chỉ email.

Ví dụ

<a href="mailto:someone@example.com">Send email</a>

Xem kết quả

Liên kết tới một số điện thoại.

Ví dụ

<a href="tel:+0869035810">+08 690 35 810</a>

Xem kết quả

Liên kết đến phần khác trên cùng một trang

Ví dụ

<a href="#section2">Đi tới Section 2</a>

Xem kết quả

Liên kết với code Javascript

Ví dụ

<a href="javascript:alert('Hello World!');">Gọi JavaScript</a>

Xem kết quả

Cài đặt CSS mặc định


Hầu hết các trình duyệt web sẽ hiển thị phần tử <a> với các giá trị mặc định sau.

a:link, a:visited {
  color: (internal value);
  text-decoration: underline;
  cursor: auto;
}

a:link:active, a:visited:active {
  color: (internal value);
}