Selektorere etter slektskap ved nesting i LESS
La oss se på hvordan man i LESS ved nesting legger til ulike selektorere som velger elementer etter slektskap. Se eksemplene.
Eksempel
Barne-selektor:
div {
> p {
color: red;
}
}
Kompileringsresultat:
div > p {
}
Eksempel
Nabo-selektor
div {
+ p {
color: red;
}
}
Kompileringsresultat:
div + p {
}
Eksempel
Slektnings-selektor:
div {
~ p {
color: red;
}
}
Kompileringsresultat:
div ~ p {
}
Praktiske oppgaver
Fortell hva resultatet av kompilering av følgende kode vil være:
ul {
color: red;
> li {
padding: 20px;
}
}
Fortell hva resultatet av kompilering av følgende kode vil være:
div {
ul {
> li {
padding: 20px;
}
}
}