Bài đăng sau đây sẽ giải thích cách sử dụng thuộc tính sự kiện con trỏ trong mã để tắt liên kết trong tài liệu HTML.
Vô hiệu hóa một liên kết bằng CSS
Thư viện CSS được sử dụng kết hợp với các ngôn ngữ khác như HTML. Vì vậy, nếu một tài liệu HTML có một liên kết để truy cập trực tiếp vào bất kỳ trang web nào khác, thuộc tính CSS pointer-events được sử dụng để vô hiệu hóa một liên kết:
sự kiện con trỏ : không có ;
con trỏ : mặc định ;
Cách sử dụng Thuộc tính sự kiện con trỏ trong Mã?
Câu lệnh kiểu CSS trong đó chúng ta sẽ thêm thuộc tính pointer-events để vô hiệu hóa liên kết nên đề cập đến lớp chứa liên kết. Ví dụ: nếu chúng ta có một lớp có tên là “không hoạt động” có chứa liên kết:
< h1 > Vô hiệu hóa liên kết bằng CSS < / h1 >< anh >
< b > liên kết: < / b >
< Một href = 'https://www.google.com/' lớp học = 'không hoạt động' > Bấm vào đây < / Một >
Trong đoạn mã trên, liên kết có thể nhấp có một lớp “không hoạt động” sẽ được sử dụng để truy cập phần tử HTML này.
Đoạn mã trên không tạo ra đầu ra sau:
Nhấp vào liên kết sẽ hướng người dùng đến công cụ tìm kiếm google:
Thuộc tính con trỏ-sự kiện
- Bên trong phần tử kiểu CSS, hãy viết thuộc tính sự kiện con trỏ ( con trỏ-sự kiện: không có ) trong khi đề cập đến lớp (không hoạt động) chứa liên kết nên bị vô hiệu hóa.
- Đặt con trỏ làm bất kỳ tùy chọn nào như mặc định, không có, con trỏ, v.v.
.không hoạt động {
sự kiện con trỏ : không có ;
con trỏ : mặc định ;
}
>
Sau khi thực thi mã, sẽ không có thay đổi trong hiển thị đồ họa của liên kết từ bên ngoài, nhưng khi người dùng nhấp vào nó sẽ không làm gì cả:
Đây là cách dễ nhất để tắt liên kết trong mã bằng các câu lệnh CSS.
Phần kết luận
Một liên kết hướng người dùng đến các trang web khác có thể dễ dàng bị vô hiệu hóa thông qua một thuộc tính CSS “pointer-events: none” đơn giản. Điều này không yêu cầu bất kỳ thay đổi nào đối với logic của mã hoặc lớp trong đó liên kết đã được tạo. Cần có một thuộc tính sự kiện con trỏ đơn giản trong phần tử kiểu đề cập đến lớp chứa liên kết.