Selectori de rudenie în imbricarea SASS
Să analizăm cum să adăugăm diferiți selectori care aleg elemente după rudenie în imbricarea SASS. Vedeți exemplele.
Exemplul
Selectorul copil:
div {
> p {
color: red;
}
}
Rezultatul compilării:
div > p {
color: red;
}
Exemplul
Selectorul adiacent
div {
+ p {
color: red;
}
}
Rezultatul compilării:
div + p {
color: red;
}
Exemplul
Selectorul de rudenie general:
div {
~ p {
color: red;
}
}
Rezultatul compilării:
div ~ p {
color: red;
}
Sarcini practice
Spuneți care va fi rezultatul compilării următorului cod:
ul {
color: red;
> li {
padding: 20px;
}
}
Spuneți care va fi rezultatul compilării următorului cod:
div {
ul {
> li {
padding: 20px;
}
}
}