:optionalPseudo-luokka tavoitteet tuloa (mukaan lukien t), joita ei ole erityisesti asetettu required(ei ole requiredattribuutti).
Tästä voi olla hyötyä, kun haluat antaa valinnaisille kentille tietyn ilmeen, ehkä hieman vähemmän näkyviä kuin vaaditut.
Syntaksi
input(type=text):optional ( border: 1px solid #eee; )Demo
Seuraavassa esittelyssä valinnaisen kentän ("Nimi", "Sukupuoli" ja "Manner") peittävyys on laskettu 40 prosenttiin, jotta käyttäjät voivat heti tietää vaaditut kentät. Tässä tapauksessa “Sähköposti”. Kun kursori on päällä, valinnainen tulo opasiteetin palaa 100 prosenttiin.
optionalToimii kaikentyyppisiä lomake-elementtien: teksti tulot kaikenlaisten, valintanappi, valintaruudut, ja valitsee.
Huomaa: CSS: llä ei voi tietää vain, että tarra on liitetty valinnaiseen kenttään, paitsi jos tarra tulee syötteen jälkeen (ja käytät sisarusyhdistelmää), mikä on harvinaista eikä yleensä ole hyvä idea. Ehkä tulevaisuudessa vanhempien valitsimet voivat auttaa tässä.
Selaimen tuki
| Kromi | Safari | Firefox | Ooppera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 10+ | 5+ | 4+ | 10+ | 10+ | Minkä tahansa | 5+ |
Huomaa, että se :optionalei ole tarkka vastakohta, :not(:required)koska jälkimmäinen sopii kaikentyyppisiin elementteihin, kun taas se :optionalon rajoitettu vain muotoelementteihin.