Een kindcombinator in CSS is het "groter dan" -symbool, het ziet er als volgt uit:
ol > li ( color: red; )Het betekent "selecteer elementen die alleen directe afstammelingen zijn". In dit geval: “selecteer lijstitems die directe afstammelingen zijn van een geordende lijst”. Illustreren:
- WILL be selected
- WILL be selected
- Will NOT be selected
- Will NOT be selected
- WILL be selected
Probeer het >symbool te verwijderen tijdens het spelen met de onderstaande demo:
Zie de Pen f149edb15c53d157a7009b816ee919d2 door CSS-Tricks (@ css-tricks) op CodePen.
Meer informatie
- Artikel over kiezers voor kinderen en broers en zussen.
- MDN Docs
Ook gekend als…
De kindcombinator is zoals de specificatie het noemt, maar je zult het ook horen noemen:
- kindselector
- directe afstammende selector
- directe afstammeling combinator
Browser-ondersteuning
| Chrome | Safari | Firefox | Opera | D.W.Z | Android | iOS |
|---|---|---|---|---|---|---|
| Ieder | Ieder | Ieder | Ieder | 7+ | Ieder | Ieder |