Lớp :focus
giả trong CSS được sử dụng để tạo kiểu một phần tử hiện đang được nhắm mục tiêu bởi bàn phím hoặc được kích hoạt bằng chuột. Đây là một ví dụ:
textarea:focus ( background: pink; )
Bất kỳ phần tử nào (phổ biến nhất là các s và
s) đều nằm trong “tiêu điểm” khi chúng được chọn và sẵn sàng nhập văn bản (như khi con trỏ nhấp nháy). Người dùng chuột có thể nhấp vào chúng (hoặc liên quan của chúng
label
) để lấy tiêu điểm và người dùng bàn phím có thể TAB vào chúng.
“Tabbing”
Việc sử dụng ký hiệu của :focus
lớp giả là "phân chia tab" qua các phần tử. Nhiều trình duyệt có trạng thái tiêu điểm mặc định cho lựa chọn tab, đó là một đường viền chấm. Nó khá dễ dàng để loại bỏ, nhưng hãy đảm bảo thay thế nó bằng một thay thế phù hợp nếu bạn làm thế.
s,
s
, s
, và textareas
tất cả đều có :focus
trạng thái theo mặc định, nhưng bạn có thể cung cấp cho một nhà nước tập trung vào bất kỳ yếu tố trong HTML. Cả thuộc tính contenteditable
và tabindex
thuộc tính đều hoạt động cho điều này, như trong ví dụ này:
Có liên quan
Bài viết ngày 12/5/2017Lớp giả `: focus-inside`




Hỗ trợ trình duyệt
Tất cả các trình duyệt đều hỗ trợ cách sử dụng cơ bản của :focus
.