Làm cách nào để áp dụng hiệu ứng di chuột trên một aphần tử, nhưng không áp dụng cho một aphần tử có lớp active?
a:hover(not: .active)
Có vẻ như thiếu một cái gì đó.
Làm cách nào để áp dụng hiệu ứng di chuột trên một aphần tử, nhưng không áp dụng cho một aphần tử có lớp active?
a:hover(not: .active)
Có vẻ như thiếu một cái gì đó.
Câu trả lời:
Ký hiệu chức năng đang bật :not(), không phải :hover:
a:not(.active):hover
Nếu bạn muốn đặt :hovertrước, điều đó tốt:
a:hover:not(.active)
Không quan trọng lớp giả nào đến trước hay sau cùng; một trong hai cách, bộ chọn hoạt động giống nhau. Đây chỉ là quy ước cá nhân của tôi để đặt :hovercuối cùng vì tôi có xu hướng đặt các lớp giả tương tác người dùng đằng sau các lớp giả cấu trúc.
Bạn có tùy chọn sử dụng not()bộ chọn.
a:not(.active):hover { ... }
Tuy nhiên, điều này có thể không hoạt động trong tất cả các trình duyệt, vì không phải tất cả các trình duyệt đều triển khai các tính năng CSS3.
Nếu bạn đang nhắm mục tiêu đến một lượng lớn đối tượng và muốn hỗ trợ các trình duyệt cũ hơn, thì cách tốt nhất là xác định một kiểu cho .active:hovervà hoàn tác bất cứ điều gì bạn đang làm a:hover.
not()msdn.microsoft.com/en-us/library/… . Có lẽ hãy xem câu trả lời của @Mendhak nếu bạn biết.