Giả lớp valid
Giả lớp valid xác định kiểu
cho các input đã nhập giá trị đúng
hoặc giá trị tương ứng với kiểu
đã chỉ định.
Cú pháp
bộ chọn:valid {
}
Ví dụ
Hãy đổi màu nền của input thành màu hồng, khi giá trị nhập vào không đúng và trở lại màu xanh lá cây, khi giá trị đã vượt qua kiểm tra sự phù hợp với kiểu đã chọn:
<p>Nhập email của bạn</p>
<p><input type="email"></p>
input:invalid {
background: #E37D76;
}
input:valid {
background: #9DDFA4;
}
:
Xem thêm
-
giả lớp
:invalid,
xác định kiểu cho input đã nhập giá trị không đúng -
giả lớp
:out-of-range,
xác định kiểu cho các phần tử có giá trị vượt ra ngoài phạm vi -
giả lớp
:in-range,
xác định kiểu cho các phần tử có phạm vi giá trị xác định