Cele mai :optionalobiective de clasă pseudo intrări (inclusiv e) , care nu sunt stabilite în mod specific ca required(nu au requiredatributul).
Acest lucru poate fi util atunci când doriți să dați câmpurilor opționale un aspect specific, poate puțin mai puțin vizibil decât cele necesare.
Sintaxă
input(type=text):optional ( border: 1px solid #eee; )Demo
În următoarea demonstrație, câmpul opțional („Nume”, „Sex” și „Continent”) are opacitatea redusă la 40%, astfel încât utilizatorii să poată ști imediat care sunt câmpurile obligatorii. În acest caz, „E-mail”. Când este deplasat, o intrare opțională va vedea opacitatea revenind la 100%.
La optionallucrările de toate tipurile de elemente de formular: textinput de toate tipurile, butoane radio, casetele de selectare, și selectează.
Notă: nu puteți ști cu CSS doar că o etichetă este asociată cu un câmp opțional, cu excepția cazului în care eticheta apare după introducere (și utilizați un combinator frate), ceea ce este rar și de obicei nu este o idee bună. Poate că în viitor selectorii părinților vă pot ajuta.
Suport pentru browser
| Crom | Safari | Firefox | Operă | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Peste 10 ani | 5+ | 4+ | Peste 10 ani | Peste 10 ani | Orice | 5+ |
Rețineți că :optionalnu este exact opusul, :not(:required)deoarece acesta din urmă se va potrivi cu toate tipurile de elemente, în timp ce :optionaleste limitat la elementele formularului.