: hoạt động - Thủ thuật CSS

Bộ :activechọn giả thay đổi giao diện của một liên kết trong khi nó đang được kích hoạt (được nhấp vào hoặc được kích hoạt theo cách khác). Nó thường chỉ được nhìn thấy trong tích tắc và cung cấp phản hồi trực quan rằng phần tử đã thực sự được nhấp. Nó thường được sử dụng nhất trên các liên kết neo ( ).

Ví dụ: đây là CSS sẽ làm cho các liên kết cố định giảm xuống một pixel (tạo ấn tượng như được đẩy trong không gian ba chiều) ở trạng thái hoạt động:

Xem Pen: trạng thái hoạt động của CSS-Tricks Team (@ css-trick) trên CodePen.

: Hoạt động cũng có thể áp dụng cho bất kỳ phần tử nào. Trong Bút bên dưới, nhấp vào bất kỳ đâu trên trang sẽ làm cho toàn bộ trang có màu vàng:

Xem Pen Demo của: lớp psuedo hoạt động của CSS-Tricks Team (@ css-trick) trên CodePen.

Cách tốt nhất là bao gồm tất cả các “trạng thái”, đặc biệt là đối với các liên kết. Một cách dễ dàng để thực hiện điều đó là "YÊU CỐ GẮNG" hoặc

L: link
O
V: đã ghé thăm
E

H: di chuột
A: hoạt động
T
E

Làm chúng theo thứ tự đó là lý tưởng.

a:link ( /* Essentially means a(href), or that the link actually goes somewhere */ color: blue; ) a:visited ( color: purple; ) a:hover ( color: green; ) a:active ( color: red; )

Nếu không, giả sử bạn đã liệt kê kiểu: đã truy cập lần cuối, nếu liên kết đó được truy cập, nó sẽ ghi đè khai báo: active và: hover và liên kết sẽ luôn có màu tím bất kể bạn đang di chuột hay liên kết đang hoạt động (không lý tưởng).