Ο ψευδο-κλάσος optional

Ο ψευδο-κλάσος optional ορίζει το στυλ ενός input στο οποίο δεν έχει οριστεί το χαρακτηριστικό required, δηλαδή αυτός ο ψευδο-κλάσος εφαρμόζεται σε μη υποχρεωτικά inputs.

Σύνταξη

cssεπιλογέας:optional {

}

Παράδειγμα

Ας ορίσουμε γκρι φόντο στο μη υποχρεωτικό input:

html<form>
  <p>
    <label>Εισάγετε αριθμό</label>
    <input type="number" required>
  </p>
  <p>
    <label>Εισάγετε κείμενο</label>
    <input type="text">
  </p>
</form>

cssinput:optional {
  background-color: #D8DFE8;
}

Результат:

Δείτε επίσης

ο ψευδο-κλάσος :default,
που ορίζει στυλ στα προεπιλεγμένα στοιχεία
ο ψευδο-κλάσος :indeterminate,
που ορίζει στυλ στα κουμπιά επιλογής που βρίσκονται σε απροσδιόριστη κατάσταση
ο ψευδο-κλάσος :placeholder-shown,
που ορίζει στυλ στα στοιχεία κατά την εμφάνιση του κειμένου-υποδείξεως
ο ψευδο-κλάσος :read-only,
που ορίζει στυλ στα inputs που δεν είναι διαθέσιμα για τροποποίηση
ο ψευδο-κλάσος :required,
που ορίζει στυλ στο input που έχει οριστεί το χαρακτηριστικό required
ο ψευδο-κλάσος :focus-within,
που ορίζει στυλ στα στοιχεία εστίασης
η ιδιότητα caret-color,
που ορίζει το χρώμα του κέρσορα κειμένου στο input