Slektorselektorar etter slektskap i SASS-innkapsling
La oss sjå på korleis ein i SASS ved innkapsling kan legge til ulike selektorar som vel element etter slektskap. Sjå døme.
Eksempel
Barneselektor:
div {
> p {
color: red;
}
}
Kompileringsresultat:
div > p {
color: red;
}
Eksempel
Naboselektor
div {
+ p {
color: red;
}
}
Kompileringsresultat:
div + p {
color: red;
}
Eksempel
Slektorselektor:
div {
~ p {
color: red;
}
}
Kompileringsresultat:
div ~ p {
color: red;
}
Praktiske oppgåver
Forklar kva resultatet av kompileringa av følgjande kode vil vere:
ul {
color: red;
> li {
padding: 20px;
}
}
Forklar kva resultatet av kompileringa av følgjande kode vil vere:
div {
ul {
> li {
padding: 20px;
}
}
}