Liên kết html

Một thẻ HTML phổ biến tiếp theo mà mình muốn giới thiệu tới các bạn đó chính là thẻ

văn bản cho đường dẫn
1 có tác dụng chèn liên kết [link] trong một tài liệu HTML

lục mục

  • I. Liên kết [link] là gì?
  • II. Chèn liên kết với thẻ a
  • III. Một vài thuộc tính hoặc đi kèm với thẻ a
  • IV. Tổng kết

I. Liên kết [link] là gì?

Trong phạm vi của loạt bài viết này, ‘liên kết’ là một cầu nối giữa 2 trang web [2 tài liệu HTML] với nhau

Thực sự thì liên kết là cái mà bạn vẫn tiếp xúc hàng ngày khi lướt web, chính là cái mà khi bạn click vào thì trình duyệt sẽ chuyển bạn đến một trang web nào đấy. Nếu bạn vẫn chưa hình dung ra, thì liên kết của nó sẽ giống như thế này

Đây là ví dụ về một đường liên kết

Rồi, bạn đã thấy nó chưa thuộc. Và phần tiếp theo mình sẽ hướng dẫn bạn cách tạo ra một cái tương tự nhé

II. Chèn liên kết với thẻ a

Gắn thẻ a trong HTML có cấu trúc như sau

Đây là ví dụ về một đường link

Nhìn bạn có thể nhận ra ngay, khi người dùng nhấp vào dòng chữ Đây là ví dụ về một đường liên kết, trình duyệt sẽ chuyển bạn đến trang web có địa chỉ là https. //phuongbinh. mạng lưới. Hóa ra để tạo một đường link với HTML cũng khó nhỉ

III. Một vài thuộc tính hoặc đi kèm với thẻ a

Ngoài thuộc tính bắt buộc href, thì thẻ a có một số thuộc tính thuộc tính tùy chỉnh khác. Cụ mình sẽ liệt kê trong bảng dưới đây

Thuộc tínhGiá trịMô tả
văn bản cho đường dẫn
2
văn bản cho đường dẫn
3. Open link in new tab
______24. Open link at tab current at [default]
văn bản cho đường dẫn
5. Mở liên kết ở tab hiện tại ngay cả khi liên kết nằm trong iframe
văn bản cho đường dẫn
6. Mở liên kết ở tab chaThể hiện việc mở liên kết mới trong tab như thế nào?
văn bản cho đường dẫn
7Tên tệp sau khi tải xuốngKhi thẻ a thuộc tính này, thì thay vì liên kết được mở trong tab, nó sẽ được tải về máy
văn bản cho đường dẫn
8alternate
author
bookmark
external
help
license
next
nofollow
noreferrer
noopener
prev
search
tagThể hiện mối quan hệ giữa hai trang web được liên kết.
Một vài giá trị của thuộc tính này có giá trị quan trọng trong SEO.

IV. Tổng kết

Thẻ a là một thẻ đơn giản và khá hay ho không đúng. Nếu có gì chưa hiểu các bạn có thể inbox mình tại fanpage Tự học lập trình, mình sẽ hỗ trợ

Bạn có thể tìm thấy các đường dẫn [liên kết] trên khắp các trang web. Liên kết cho phép nhấp vào để chuyển sang một trang khác

Đường dẫn trong HTML là gì

Các đường dẫn trong HTML là các đường siêu liên kết. Nhấp vào đó sẽ giúp đưa bạn đến một văn bản khác. Khi rê chuột qua đường dẫn, biểu tượng mũi tên của chuột sẽ chuyển thành biểu tượng bàn tay

Lưu ý. Đường dẫn không nhất thiết phải là văn bản, có thể là hình ảnh hoặc các phần tử HTML khác

Cú pháp đường dẫn trong HTML

Trong HTML, đường dẫn được định nghĩa bằng thẻ

Tổng hợp các bài học HTML
4

văn bản cho đường dẫn

Ví dụ

Tổng hợp các bài học HTML

Thuộc tính

Tổng hợp các bài học HTML
5 được sử dụng để xác định địa chỉ của điểm đến cụ thể. [https. //quantrimang. com/html/] Văn bản cho đường dẫn là phần sẽ hiển thị, nhấp vào đây sẽ đưa bạn tới địa chỉ đó

Lưu ý. Nếu không sử dụng gạch chéo cho địa chỉ thư mục con, có thể tạo ra 2 yêu cầu tới máy chủ. Nhiều máy chủ tự động thêm dấu gạch cho rồi mới tạo yêu cầu

Đường dẫn nội bộ Local Link

Ví dụ về việc sử dụng đường dẫn URL cho cả trang web, liên kết nội bộ [liên kết đến cùng một trang web] được xác định chỉ bằng URL liên quan [không cần https. //www. ]

Hình ảnh HTML

Path color HTML

Đường dẫn mặc định sẽ hiển thị như sau [trên tất cả trình duyệt]

  • Đường dẫn chưa được thăm/click [unvisit] màu xanh dương và bị gạch chân
  • Đường dẫn đã được ghé thăm/nhấn vào [ghé thăm] màu tím và được gạch chân
  • Đường dẫn hoạt động [active] màu đỏ và gạch chân

You can change default color by CSS

Ví dụ


a:link {
  color: green;
background-color: transparent;
text-decoration: none;
}

a:visited {
  color: pink;
  background-color: transparent;
  text-decoration: none;
}

a:hover {
color: red;
background-color: transparent;
text-decoration: underline;
}

a:active {
color: yellow;
background-color: transparent;
text-decoration: underline;
}

Thuộc tính mục tiêu

Thuộc tính

Tổng hợp các bài học HTML
6 dùng để xác định xem sẽ mở văn bản được liên kết ở đâu, có thể là các giá trị sau

_blank open at the window or tab new
_self open at the same window/tab [default]
_parent open at the parent [parent
_top mở ở toàn bộ cửa sổ
framename mở ở khung đặt tên [named frame]

Ví dụ dưới đây mở văn bản ở cửa sổ/tab mới

________số 8

Nếu trang web bị đóng trong khung, bạn có thể sử dụng

Tổng hợp các bài học HTML
7 để phá vỡ khung

Tổng hợp các bài học HTML
0

Đường dẫn dưới dạng hình ảnh

Tổng hợp các bài học HTML
1

Tổng hợp các bài học HTML
8 được thêm vào để ngăn chặn IE9 [và trở về trước] hiển thị đường viền xung quanh ảnh [khi ảnh là một đường dẫn]

Tiêu đề đường dẫn

Thuộc tính tiêu đề được sử dụng để xác định thông tin bổ sung cho phần tử. Thông thường hiển thị dưới dạng chú giải công cụ khi con trỏ chuột qua phần tử

Tổng hợp các bài học HTML
3

Create a page mark

Đánh dấu trang trong HTML được sử dụng để người đọc dễ dàng đi tới các phần khác trong trang web. Đánh dấu trang rất hữu ích khi trang web quá dài

Trước hết bạn phải đánh dấu trang rồi sau đó thêm đường dẫn đến đó. Khi nhấp vào liên kết, trang sẽ cuộn tới địa chỉ được đánh dấu trang đó

Tạo dấu trang bằng thuộc tính

Tổng hợp các bài học HTML
9

Tổng hợp các bài học HTML
5

Sau đó gắn đường dẫn tới dấu trang đó [Đi tới Chương 16] từ cùng một trang

Tổng hợp các bài học HTML
6

Đường dẫn tới dấu trang [Đi tới Chương 16] từ trang khác

Tổng hợp các bài học HTML
0

Đường dẫn bên ngoài

Đường dẫn bên ngoài có thể tham chiếu đến URL hoặc đường dẫn liên quan đến trang web hiện tại. Ví dụ dưới đây sử dụng URL đầy đủ

Tổng hợp các bài học HTML
1

Ví dụ dưới đây dẫn đến trang web trong thư mục HTML của cùng một trang web

Tổng hợp các bài học HTML
2

Ví dụ dưới đây dẫn đến trang web được đặt trong cùng thư mục của cùng trang hiện tại

Tổng hợp các bài học HTML
3

Bài trước. Tạo kiểu cho HTML với CSS

bài sau. Hình ảnh trong HTML

  • Bảng trong HTML

Thứ Tư, 15/04/2020 16. 01

3,813 👨 33. 284

0 Bình luận

Sắp xếp theo

Delete Login to Send

Bạn nên đọc

  • IBM vượt qua Microsoft về giá trị vốn hóa sau 15 năm
  • Bạn chọn máy tính bảng hay netbook?
  • Windows 8 RTM có gì mới?
  • Phát hành tiểu hành tinh 'sát thủ' nằm giữa Trái đất và sao Kim
  • Bí ẩn dấu chân người lên tới 290 triệu năm tuổi thách đố các nhà khoa học trên thế giới
  • Chuyển thanh công cụ Google sang chiều dọc

HTML

  • Tham khảo Canvas trong HTML
  • Thẻ HTML
  • Thẻ HTML
  • Thẻ HTML
  • Thẻ HTML
  • API định vị địa lý HTML
Xem thêm

HTML

  • HTML cơ bản
    • Giới thiệu về HTML
    • Công cụ soạn thảo HTML
    • Các ví dụ cơ bản về HTML
    • Các phần tử trong HTML
    • Các thuộc tính trong HTML
    • Tiêu đề trong HTML
    • Đoạn văn trong HTML
    • Thuộc tính Style trong HTML
    • Định dạng văn bản trong HTML
    • Các phần tử trích dẫn trong HTML
    • Thẻ chú thích trong HTML
    • Color color in HTML
    • Cách chèn khoảng trống trong HTML
    • Tạo kiểu cho HTML với CSS
    • Các đường dẫn trong HTML
    • Hình ảnh trong HTML
    • Table biểu tượng trong HTML
    • Danh sách trong HTML
    • Phần tử khối và dòng nội dung trong HTML
    • Thuộc tính class trong HTML
    • Thuộc tính id trong HTML
    • Iframe trong HTML
    • JavaScript trong HTML
    • File path in HTML
    • Phần tử Head trong HTML
    • Bố cục trong HTML
    • Đáp ứng trong HTML
    • Phần mã máy tính trong HTML
    • HTML Entities - Entity character in HTML
    • Symbol - Biểu tượng trong HTML
    • Mã hóa ký tự trong HTML [Charset]
    • Bộ định vị tài nguyên thống nhất - URL trong HTML
    • HTML và XHTML
    • Thuộc tính Global trong HTML
  • Biểu mẫu trong HTML
    • Biểu mẫu trong HTML
    • Các phần tử của biểu mẫu trong HTML
    • Các loại dữ liệu đầu vào của phần tử đầu vào trong HTML
    • Thuộc tính của phần tử đầu vào trong HTML
  • HTML5
    • Giới thiệu về HTML5
    • Hỗ trợ HTML5 trên các trình duyệt
    • Các phần tử mới trong HTML5
    • Semantic Element [Yếu tố ngữ nghĩa] trong HTML5
    • Cách chuyển từ HTML4 sang HTML5
    • Định dạng chuẩn và quy ước viết mã
  • Đồ họa trong HTML
    • Phần tử Canvas
    • Phần tử SVG
  • Phương tiện trong HTML
    • Media Format
    • Thẻ video
    • Cắm vào
    • Video trên YouTube
  • API trong HTML
    • API định vị địa lý
    • API kéo và thả
    • API lưu trữ web
    • API công nhân web
    • API SSE
  • Ví dụ về HTML
  • Tham khảo HTML
    • Tham khảo HTML section
    • Hỗ trợ trình duyệt
    • Thuộc tính sự kiện
    • Mã màu
    • Tranh sơn dầu
    • DOM âm thanh/video HTML
    • Loại tài liệu HTML
    • Mã hóa URL
    • Language language code
    • HTTP status status
    • Tham chiếu mã quốc gia
  • Thẻ HTML

Giới thiệu. Điều khoản. bảo mật. Hướng dẫn. Ứng dụng. Liên hệ. Quảng cáo. Facebook. YouTube. DMCA

Giấy phép số 362/GP-BTTTT. Bộ Thông tin và Truyền thông cấp ngày 30/06/2016. Cơ quan chủ quản. CÔNG TY CỔ PHẦN MẠNG TRỰC TUYẾN META. address. 56 Duy Tân, Dịch Vọng Hậu, Cầu Giấy, Hà Nội. Điện thoại. 024 2242 6188. E-mail. thông tin @ meta. vn. Chịu trách nhiệm nội dung. Lê Ngọc Lâm

Bản quyền © 2003-2022 QuanTriMang. com. Giữ toàn quyền. Không thể sao chép hoặc sử dụng hoặc phát hành lại bất kỳ nội dung nào thuộc về QuanTriMang. com khi chưa được phép

Chủ Đề