input:not([type=radio]){ ... }
input:not([type=checkbox]) { ... }
input:not([type=range]) {... }Instead,weneedtochainour:not()pseudo-classes,sothattheyallfiltertheinput
element:^15
input:not([type=radio]):not([type=checkbox]):not([type=range]) {}Usingpseudo-classes(andpseudo-elements)withoutasimpleselectoristheequi-
valentofusingitwiththeuniversalselector.Inotherwords,:not([type=radio])
isthesameas:not([type=radio]).Inthiscase,everyelementthatlacksatype
attributeandvalueofradio will match―including htmlandbody.Topreventthis,
use:not()withaselectorsuchasaclassname,ID,orattributeselector.Bythe
way,thisalsoholdstruetrueforclassname,ID,andattributeselectors:.warning
and[type=radio]arethesameas.warningand*[type=radio].
CSSSelectorsLevel 4 refinestheway:not()works,sothatitcanacceptalistas
anargument,andnotjustsimpleselectors.Ratherthanchainingpseudo-classesas
previously,we’llbeabletouseacomma-separatedargument:
input:not([type=radio], [type=checkbox], [type=range]) {}Unfortunately,nomajorbrowsersupportsthisyet,sousechaininginthemeantime.
Selecting Elements by Their Index
CSSalsoprovideselectorsformatchingelementsbasedontheirpositioninthe
documentsubtree.Theseareknownaschild–indexedpseudo-classes,becausethey
relyonthepositionororderoftheelementratherthanitstype,attributes,orID.
Therearefive:
(^15) Theselectorchainbelowwillalsomatch[type=image],[type=reset],[type=color],
and[type=submit]elements.
Selectors 45