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

cssbộ 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:

html<p>Nhập email của bạn</p>
<p><input type="email"></p>

cssinput:invalid {
  background: #E37D76;
}
input:valid {
  background: #9DDFA4;
}

Результат:

Xem thêm