Thứ tư, 26/08/2020 | 00:00 GMT+7

Cách thêm siêu liên kết trong HTML


Một phần của loạt bài: Cách xây dựng trang web bằng HTML

Loạt bài hướng dẫn này sẽ hướng dẫn bạn cách tạo và tùy chỉnh thêm trang web này bằng HTML, ngôn ngữ đánh dấu tiêu chuẩn được sử dụng để hiển thị tài liệu trong trình duyệt web. Không cần trải nghiệm viết mã trước nhưng ta khuyên bạn nên bắt đầu từ đầu loạt bài nếu bạn muốn tạo lại trang web trình diễn.

Ở phần cuối của loạt bài này, bạn sẽ có một trang web sẵn sàng để triển khai lên cloud và làm quen cơ bản với HTML. Biết cách viết HTML sẽ cung cấp nền tảng vững chắc để học các kỹ năng phát triển web front-end bổ sung, chẳng hạn như CSS và JavaScript.

Hướng dẫn này sẽ hướng dẫn bạn các bước thêm siêu liên kết vào trang web .

Các siêu liên kết có thể được thêm vào văn bản hoặc hình ảnh bằng phần tử liên kết neo <a> . Thẻ <a> yêu cầu thuộc tính href , được sử dụng để chỉ định liên kết đích. Phần tử <a> được sử dụng như thế này:

<a href="www.DestinationLink.com">The text you want to link</a> 

Hãy thử thêm đoạn mã bên dưới vào file “index.html” của bạn và thay đổi văn bản được đánh dấu mẫu bằng một liên kết thực, chẳng hạn như https://digitalocean.com/community :

<a href="https://www.digitalocean.com/community">The text you want to link</a> 

(Nếu bạn chưa theo dõi loạt bài hướng dẫn, bạn có thể xem lại hướng dẫn cài đặt index.html trong hướng dẫn Cài đặt Dự án HTML của bạn . Lưu file và tải file đó trong trình duyệt của bạn.

Bạn sẽ nhận được một kết quả như thế này:

Liên kết HTML

Bạn cũng có thể liên kết hình ảnh bằng cách bao bọc một phần tử hình ảnh với một phần tử <a> như vậy:

<a href="https://www.digitalocean.com/community">The text you want to link <img src="https://html.sammy-codes.com/images/small-profile.jpeg"> </a> 

Hãy thử kiểm tra đoạn mã trong trình duyệt của bạn để kiểm tra xem nó có hoạt động không. Đến đây bạn sẽ hiểu cách thêm siêu liên kết vào văn bản và hình ảnh trên trang web của bạn .


Tags:

Các tin liên quan

Cách thêm một Favicon vào trang web của bạn bằng HTML
2020-08-26
Tạo phần trên cùng của trang chủ của bạn bằng HTML
2020-08-26
Cách sử dụng các thuộc tính HTML
2020-08-26
Cách sửa đổi màu của các phần tử HTML
2020-08-26
Cách lồng các phần tử HTML
2020-08-26
Cách sử dụng các phần tử cấp nội tuyến và cấp khối trong HTML
2020-08-26
Cách sử dụng các phần tử cấp nội tuyến và cấp khối trong HTML
2020-08-26
Cách viết HTML nhanh chóng bằng Emmet
2019-07-02
Sử dụng vue-template-loader với Vue.js để biên dịch các mẫu HTML
2018-01-18
Nhận và thiết lập thẻ meta HTML trong Angular
2017-11-27