pseudo-class :focus-visible CSS

Định nghĩa và cách sử dụng

CSS :focus-visible pseudo-class được sử dụng để áp dụng樣式 tập trung chỉ khi tập trung qua bàn phím, không phải qua chuột.

Đây có thể được sử dụng với :focus Kết hợp sử dụng, tạo ra các樣式 tập trung khác nhau cho tập trung bàn phím và tập trung chuột/touch.

Mô hình

Chọn và thiết lập樣式 cho nút có thể tập trung bằng phím Tab trên bàn phím:

button:focus-visible {
  outline: 2px solid red;
}

Thử ngay

Ngữ pháp CSS

:focus-visible {
  các định nghĩa css;
}

Chi tiết kỹ thuật

Phiên bản: CSS4

Hỗ trợ trình duyệt

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ pseudo-class.

Chrome Edge Firefox Safari Opera
86 86 85 15.4 72

Trang liên quan

Giáo trình:pseudo-class CSS

Tham khảo:pseudo-class :focus CSS