Den :only-of-typepseudo-klasse vælgeren i CSS betegner enhver detalje, som ikke har nogen søskende af en given type.
p:only-of-type ( color: red; )Hvis intet mærke går forud for vælgeren, vil det matche ethvert tag (f.eks. :only-of-type). Hvis en anden vælger går foran den, matches den baseret på den type tag, som vælgeren matcher. For eksempel .example:only-of-typevil opføre sig som p:only-of-typehvis .exampleanvendes til et afsnit element.
Simpelt eksempel
En liste indeholder kun et enkelt listeelement. En anden liste indeholder tre listeelementer. Vi kan målrette mod det listeelement, der er alene om :only-of-type.
Selvom det måske ikke er det bedste eksempel, fordi det :only-childvil fungere lige så godt der, da listeelementer er de eneste mulige børn på lister. Hvis vi bruger divs i stedet, kan vi målrette mod et afsnit inde i en div, hvis det er det eneste afsnit, på trods af at andre elementer også er derinde.
At notere
Som en sjov til side kunne du opnå det samme valg som :only-of-typemed :first-of-type:last-of-typeeller :nth-of-type(1):nth-last-of-type(1). De bruger dog to kædede vælgere, hvilket betyder, at specificiteten er dobbelt så stor som den :only-of-type.
Browsersupport
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Nogen | Nogen | Nogen | Nogen | IE9 + | Nogen | Nogen |