Sugulusselektorid LESS-i pesastuses
Vaatame, kuidas LESS-is pesastamise ajal lisada erinevaid selektoreid, mis valivad elemente suguluse alusel. Vaadake näiteid.
Näide
Lapse selektor:
div {
> p {
color: red;
}
}
Kompileerimise tulemus:
div > p {
}
Näide
Naaberselektor
div {
+ p {
color: red;
}
}
Kompileerimise tulemus:
div + p {
}
Näide
Õed-selektor:
div {
~ p {
color: red;
}
}
Kompileerimise tulemus:
div ~ p {
}
Praktilised ülesanded
Kirjelda, milline on järgmise koodi kompileerimise tulemus:
ul {
color: red;
> li {
padding: 20px;
}
}
Kirjelda, milline on järgmise koodi kompileerimise tulemus:
div {
ul {
> li {
padding: 20px;
}
}
}