Sammenlægning af selektorer i SASS
Sommetider har vi brug for, at nestede konstruktioner ved kompilering forbindes ikke med mellemrum, men sammenhængende. For at gøre dette foran navnet på den nestede selektor er det nødvendigt at placere et ampersand:
div {
&.block {
width: 300px;
}
}
Som et resultat efter kompilering får vi følgende kode:
div.block {
width: 300px;
}
Fortæl, hvad resultatet af kompilering af følgende kode vil være:
#block {
&.xxx {
width: 300px;
}
}
Fortæl, hvad resultatet af kompilering af følgende kode vil være:
#block {
.xxx {
width: 300px;
}
}
Fortæl, hvad resultatet af kompilering af følgende kode vil være:
#block {
&.xxx {
&.zzz {
width: 300px;
}
}
}
Fortæl, hvad resultatet af kompilering af følgende kode vil være:
#block {
&.xxx {
.zzz {
width: 300px;
}
}
}
Fortæl, hvad resultatet af kompilering af følgende kode vil være:
#block {
.xxx {
&.zzz {
width: 300px;
}
}
}