บทบาทของ CSS :optional Selector

ใช้ :optional เพื่อจัดสไตล์ <input> ที่ ไม่มี Attribute required (กรอกหรือไม่ก็ได้)

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
    <style>
        input:optional {
            background-color: blue;
        }
    </style>
</head>
<body>
    <form>
        Subject: <input type="text" name="subject"><br>
        Student: <input type="text" name="student" required><br>
    </form>
</body>
</html>

ผลลัพธ์: Input "Subject" (ไม่มี required) จะมีพื้นหลังสีน้ำเงิน Input "Student" (มี required) จะไม่ได้รับผล