Một trang web được tạo thành từ nhiều phần thông tin khác nhau nằm trong các phần khác nhau và trên các trang khác nhau trong chính trang web đó. Bạn cũng có thể tìm thông tin liên quan đến trang web đó trên các trang trên các trang web khác nhau. Tất cả các phần và trang này được liên kết với nhau trong HTML

Bạn đang xem: mã html cho liên kết trang web

Một trang web được tạo thành từ các phần thông tin khác nhau trực tiếp trong các phần khác nhau và trên các trang khác nhau trong chính trang web.

Bạn cũng có thể tìm thông tin liên quan đến trang web đó trên các trang thuộc các trang web khác nhau.

Tất cả các phần và trang này được liên kết với nhau trong HTML bằng thuộc tính href .

Trong bài viết này, chúng ta sẽ xem xét thuật ngữ Siêu kết nối. Sau đó, chúng ta sẽ tìm hiểu về các cách khác nhau mà bạn có thể tạo siêu liên kết, href làm gì và cách sử dụng thuộc tính href một cách thích hợp để liên kết các phần và trang.

Trong HTML, có nhiều dạng liên kết khác nhau. Trong hình ảnh, có thuộc tính src để “liên kết” nguồn của hình ảnh.

Đối với biểu định kiểu, có thẻ link với thuộc tính href để “liên kết” nguồn của biểu định kiểu.

Đối với thẻ liên kết, có thuộc tính href để “liên kết” phần hoặc trang được tham chiếu. Liên kết neo còn được gọi là siêu liên kết.

Khi người dùng theo dõi một siêu liên kết, họ đang điều hướng đến trang đó. Siêu liên kết là các phần tử tham chiếu đến một tài liệu khác, sao cho khi người dùng nhấp vào phần tử đó, họ sẽ được chuyển hướng đến tài liệu mới.

Như đã nêu ở trên, bạn có thể muốn liên kết các trang khác nhau (trong trang web của bạn hoặc bên ngoài) hoặc các phần trên trang web của bạn.

Trong bài viết này, tôi sẽ nêu bật ba cách tạo siêu liên kết. Những cách khác nhau này rất quan trọng cần biết vì chúng xác định giá trị của thuộc tính href .

Được rồi, bây giờ chúng ta hãy xem xét ba cách khác nhau đó.

1. Khi bạn muốn liên kết đến các phần của trang

Ví dụ: bạn có thể sử dụng phương pháp này khi tạo trang có mục lục.

Trong trường hợp này, bạn có thể không muốn người đọc phải cuộn xuống phần cuối cùng. Thật tuyệt nếu họ có thể nhấp vào nó trong mục lục và trình duyệt sẽ đưa họ trực tiếp đến đó.

Loại liên kết này xảy ra trong cùng một tài liệu và chỉ đưa người đọc đến các phần khác nhau. Chúng ta sẽ tìm hiểu cách tạo siêu liên kết cho trường hợp sử dụng này khi chúng ta tìm hiểu về thuộc tính href .

2. Khi bạn muốn liên kết đến một trang khác trong một trang web

Trên trang web của bạn, bạn có thể có trang chủ, trang giới thiệu, trang dịch vụ và các loại trang khác. Phương pháp này giúp người dùng điều hướng từ trang này sang trang khác.

Xem Thêm  INSERT INTO SELECT tổng quan và ví dụ về câu lệnh - chèn sql vào lựa chọn từ cùng một bảng

3. Khi bạn muốn liên kết đến các trang bên ngoài

Đôi khi, trang web của bạn có thể không chứa một số thông tin nhất định và một trang web khác có thể có thông tin đó. Trong những trường hợp như vậy, bạn có thể muốn tham khảo trang web khác.

Để làm điều này, bạn sẽ tạo một siêu liên kết bên ngoài để điều hướng người dùng đến trang web khác.

Đây là ba cách chính để liên kết các trang. Bây giờ, hãy xem thuộc tính href có thể giúp bạn kích hoạt chúng như thế nào.

Cách sử dụng thuộc tính href

href là một thuộc tính được sử dụng để tham chiếu đến một tài liệu khác. Bạn có thể tìm thấy nó trên thẻ link và thẻ anchor .

Thuộc tính href được sử dụng trên các thẻ liên kết ( a ) để tạo siêu liên kết trong các trang web. Giá trị của thuộc tính chứa URL mà siêu liên kết trỏ tới. Bạn có thể sử dụng nó như thế này:

  & lt; a href = "URL" & gt; Siêu liên kết & lt; / a & gt;
 

Tuy nhiên, các giá trị URL có thể khác nhau tùy thuộc vào những gì bạn đang trỏ đến. Đối với ba cách mà chúng tôi đã xem xét trước đó, hãy xem cách bạn có thể sử dụng href .

Trong trường hợp này, giá trị sẽ là id của phần tử bắt đầu phần. Điều đó có nghĩa là chúng ta sẽ có một cái gì đó như thế này:

  & lt; a href = "# second-section" & gt; Chuyển đến phần thứ hai & lt; / a & gt;
& lt;! -
  Một số nội dung ở đây
 - & gt;
& lt; section id = "second-section" & gt;
& lt; h2 & gt; Phần thứ hai & lt; / h2 & gt;
& lt; / phần & gt;
 

Khi siêu liên kết “Chuyển đến phần thứ hai” được nhấp vào, trình duyệt sẽ cuộn xuống phần có id được liên kết. Ngoài ra, URL trên thanh URL của trình duyệt cũng thay đổi.

Ví dụ: nếu URL trước đó là mywebsite.com , thì URL mới sẽ là mywebsite.com # second-option.

2. Cách sử dụng href để liên kết các trang trong trang web

Để sử dụng href theo cách này, bạn cần hiểu URL tương đối và URL tuyệt đối là gì.

URL tương đối là các URL ngắn trỏ đến một tài liệu trên cùng một trang web. Nó giống như việc bạn đang ở đâu, làm cách nào để bạn đến được nơi này, nơi khác trên cùng một trang web?

Xem Thêm  Lấy đầu vào bằng Python - câu lệnh đầu vào bằng python

Điều này trái ngược với URL tuyệt đối. Đối với những điều này, bạn không quan tâm đến vị trí hiện tại của mình – bạn cung cấp đầy đủ thông tin chi tiết để đến một nơi khác như bạn đã bắt đầu lại từ đầu.

Để điều hướng giữa các trang trực tuyến trên một trang web, bạn có thể sử dụng bất kỳ URL nào trong số các URL này, nhưng URL tương đối thường được sử dụng.

Giả sử bạn đang ở trang chủ và bạn muốn tham khảo trang giới thiệu. Dưới đây là cách sử dụng thuộc tính href để làm điều đó:

  & lt; a href = '/ about' & gt; Giới thiệu về trang & lt; / a & gt;
 

Từ trang chủ (giả sử mywebsite.com ), liên kết trên sẽ điều hướng đến mywebsite.com/about .

Có một số điều đáng lưu ý về dấu gạch chéo ( / ) trước liên kết. / yêu cầu trình duyệt thêm liên kết vào thư mục gốc của trang web (là miền). Vì vậy, gốc là mywebsite.com và liên kết được thêm vào như sau: mywebsite.com/about .

Nếu không có dấu gạch chéo ( & lt; a href = 'about' & gt; ), trình duyệt sẽ thay thế đường dẫn hiện tại bằng / about .

Ví dụ: nếu chúng tôi hiện đang truy cập mywebsite.com/projects/generator và chúng tôi có các liên kết sau:

  & lt; a href = 'about' & gt; About 1 & lt; / a & gt;
& lt; a href = '/ about' & gt; About 2 & lt; / a & gt;
 

“Khoảng 1” sẽ điều hướng đến mywebsite.com/projects/about (thay thế đường dẫn hiện tại / generator ) và “About 2” sẽ điều hướng đến mywebsite.com/about

3. Cách sử dụng href để liên kết đến các trang trên trang web khác

Vì nó nằm trên một trang web khác, không có cách nào chúng tôi có thể sử dụng URL tương đối. Đối với điều này, chúng tôi cần chỉ định nguồn tuyệt đối của tài liệu mà chúng tôi đang tham khảo.

Ví dụ: giả sử chúng tôi đang ở trên mywebsite.com và chúng tôi muốn tham chiếu đến google.com , đây là cách chúng tôi thực hiện với href :

  & lt; a href = 'https: //google.com'> Google & lt; a & gt;
 

Nếu chúng tôi chỉ viết google.com , thì trình duyệt sẽ coi nó như một trang trong một trang web, do đó gắn nó vào mywebsite.com .

Kết luận

Trong bài viết này, chúng ta đã biết cách thuộc tính href cho phép chúng ta tạo các loại liên kết khác nhau. Các liên kết khác nhau này hiển thị các cách khác nhau mà các tài liệu / trang có thể được tham chiếu trong một trang web.


Xem thêm những thông tin liên quan đến chủ đề mã html cho liên kết trang web

Tự học HTML và code ra cái web đơn giản trong 15 phút

  • Tác giả: Phạm Huy Hoàng
  • Ngày đăng: 2021-06-07
  • Đánh giá: 4 ⭐ ( 4546 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Như đã hứa với các bạn, mình sẽ dần dần ra mắt các vlog trong series “Trở thành Phun Sờ Nắc sau 3 tiếng”.
    Vlog đầu tiên sẽ hướng dẫn các bạn một ngôn ngữ hết sức cơ bản để xây dựng trang web – HTML (Đọc là Hát Tê Mờ Lờ hoặc Ét Tê Em Eo đều được nhé).
    Tụi mình cũng sẽ code một trang web siêu siêu đơn giản nha.

    Danh sách khoá học của Cybersoft: https://bit.ly/codedao-cyber
    Tư vấn khoá học free Cybersoft: https://fb.com/lophocviet
    Nhớ nói được anh Hoàng giới thiệu để được nhận ưu đãi nhé hihi.

    Nhớ subscribe cho mình nhe: https://bit.ly/codedaotube

    Học xong các bạn có thể xem thêm các phần sau:
    – Học HTML trong 15 phút: https://youtu.be/jSyH0HxKQPY
    – Học CSS trong 15 phút: https://youtu.be/DUwx3IdXupU
    – Học JS trong 15 phút https://youtu.be/watch?v=ZIgDYEZl1VE
    – Kết hợp HTML CSS JS https://youtu.be/watch?v=JL2o5qixOPI
    – Code 4 dự án HTML CSS JS https://youtu.be/watch?v=YtYcYRsODmI

    Timestamp:
    00:00 Bắt đầu vlog
    01:30 Giới thiệu ngôn ngữ HTML
    04:20 Bắt đầu viết code HTML, các tag hiển thị thông tin
    09:40 HTML Form, lấy thông tin từ người dùng
    11:25 Tự code web giới thiệu bản thân
    13:30 Giới thiệu CSS kì sau

    Channel Tôi Đi Code Dạo là nơi mình chia sẻ những kiến thức, kinh nghiệm về ngành lập trình mà mình đạt được trong quá trình làm việc. Những kiến thức này sẽ biến các bạn từ một coder trở thành developer – lập trình viên thứ thiệt.
    Nhớ ghé thăm và subscribe channel để xem clip mới vào 8H TỐI T3 hàng tuần nha!

    Ghé thăm mình tại:
    Blog: https://toidicodedao.com/
    Fanpage: https://www.facebook.com/toidicodedao/

    html code_cung_code_dao hoc_html_15_phut

Thẻ tạo liên kết HTML

Tạo Trang Landing Page Bằng HTML CSS

  • Tác giả: www.niemvuilaptrinh.com
  • Đánh giá: 3 ⭐ ( 7165 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài viết hôm nay mình sẽ giới thiệu đến bạn cách tạo landing page bằng HTML CSS cho trang web nhé!

Chuyển hướng liên kết đã được mã hoá cho WordPress

  • Tác giả: caodem.com
  • Đánh giá: 4 ⭐ ( 2314 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Cách tạo một cái liên kết (Link) trong HTML

  • Tác giả: www.cic32.com.vn
  • Đánh giá: 3 ⭐ ( 9423 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Cách tạo một cái liên kết (Link) trong HTML

[HTML/HTML5] Phần 14: Liên kết trong HTML

  • Tác giả: www.dammio.com
  • Đánh giá: 4 ⭐ ( 2880 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Seller Education Hub

  • Tác giả: banhang.shopee.vn
  • Đánh giá: 3 ⭐ ( 8827 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

By ads_php