พิวโดคลาส invalid

พิวโดคลาส invalid กำหนดสไตล์ สำหรับอินพุตที่ป้อนค่าที่ไม่ถูกต้อง หรือค่าไม่ตรงกับประเภทที่ระบุไว้

ไวยากรณ์

selector:invalid {

}

มาเปลี่ยนพื้นหลังของอินพุตเป็นสีชมพู เมื่อป้อนค่าที่ไม่ถูกต้อง และเปลี่ยนกลับ เป็นสีเขียว เมื่อค่าผ่าน การตรวจสอบความถูกต้องตาม ประเภทที่เลือก:

<p>Enter Your email</p>
<p><input type="email"></p>

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

พิวโดคลาส :valid,
ซึ่งกำหนดสไตล์ให้อินพุตที่ป้อนค่าถูกต้อง
พิวโดคลาส :default,
ซึ่งกำหนดสไตล์ให้องค์ประกอบที่กำหนดเป็นค่าเริ่มต้น
พิวโดคลาส :in-range,
ซึ่งกำหนดสไตล์ให้องค์ประกอบที่มีค่าภายในช่วงที่กำหนด
พิวโดคลาส :out-of-range,
ซึ่งกำหนดสไตล์ให้องค์ประกอบที่มีค่าอยู่นอกเหนือช่วงที่กำหนด