Seletor pai com CSS
153d atrás
Sempre foi simples selecionar um elemento filho com #CSS. Como no exemplo a seguir:
<li>
<a class="active">Link 1</a>
</li>
<li>
<a>Link 1</a>
</li>
<li>
<a>Link 1</a>
</li>
li > a.active {
color: red;
}
No entanto, não era possível tempos atrás estilizar o elemento pai, apenas com CSS. Isso mudou, agora é possível selecioná-lo com a pseudo-classe :has().
No CSS abaixo, vamos selecionar o elemento pai "li", que tenha um elemento filho "a" com a classe ".active".
li:has(> a.active) {
background-color: yellow;
}
Comentários (0)