CSS Master

(Primo) #1
Figure 1.45. Selecting even-indexed p elements with :nth-last-of-type(even)

Ifthisstillseemsfuzzy,playwithPaulMaloney’sNth-Testtool,^17 orviewtheex-
amplesatNthMaster.^18 Bothprojectsareexcellentwaystolearnmoreaboutthese
pseudo-classes.

Styling Form Fields Based on Input


Let’stakealookatsomepseudo-classesthatarespecifictoformfieldsandform
fieldinput.Thesepseudo-classescanbeusedtostylefieldsbasedonthevalidity
ofuserinput,whetherthefieldisrequiredorcurrentlyenabled.

Allofthepseudo-classesthatfollowarespecifictoforms.Asaresult,there’sless
ofaneedtolimitthescopewithaselector.Using:enabledwon’tintroduceside
effectsforspanelements.Limitingthescopeishelpful,however,whenyouwant
tosylevarioustypesofformcontrolsdifferently.

:enabled and :disabled
Astheirnamesuggests,thesepseudo-classesmatchelementsthathave(orlack)the
disabledHTML5attribute.Thiscanbeaninputcontrolsuchasinput,select,or
buttonelement(seenshortly),oritcanbeafieldsetelement:

(^17) http://nth-test.com/
(^18) http://nthmaster.com/
62 CSS Master

Free download pdf