Seletores por parentesco em aninhamento LESS
Vamos examinar como adicionar vários seletores que escolhem elementos por parentesco ao aninhar em LESS. Veja os exemplos.
Exemplo
Seletor filho:
div {
> p {
color: red;
}
}
Resultado da compilação:
div > p {
}
Exemplo
Seletor adjacente:
div {
+ p {
color: red;
}
}
Resultado da compilação:
div + p {
}
Exemplo
Seletor geral de irmãos:
div {
~ p {
color: red;
}
}
Resultado da compilação:
div ~ p {
}
Tarefas práticas
Explique qual será o resultado da compilação do seguinte código:
ul {
color: red;
> li {
padding: 20px;
}
}
Explique qual será o resultado da compilação do seguinte código:
div {
ul {
> li {
padding: 20px;
}
}
}
