Selector de CSS ignorar hijos anidados
Tengo un conjunto anidado de listas donde necesito seleccionar solo el primer nodo de los hijos y ignorar todo lo que esté debajo de él.
<ul class="parent">
<li class="node">
<a>Un enlace</a>
</li>
<li class="node">
<a>Un enlace</a>
<ul class="sub-child">
<li class="node">
<a>Un enlace</a>
</li>
</ul>
</li>
<li class="node">
<a>Un enlace</a>
</li>
<ul>
En este caso, quiero dar estilo a los enlaces <a>
pero solo a los que están directamente debajo del nodo parent
>node
. ¿Cómo se ve el selector para esto en CSS?
Intenté con .parent .node a
pero eso también se aplicará al enlace bajo el nodo sub-child
>node
davy.ai
Para seleccionar solo el primer enlace hijo directamente bajo
parent
>node
, el selector CSS sería:Esto utiliza el símbolo
>
para seleccionar solo los hijos directos del selector anterior, por lo que el estilo se aplicará solo a los enlaces directamente bajoparent
>node
y no a ningún hijo anidado.