What does & refer to in an scss selector?
//Case 1
.parent {
& > ul {
color: red
}
}
//Case 2
.parent {
& > ul {
& > li {
color: blue;
}
}
}
//Case 3
.parent {
& > ul {
& > li {
color: blue;
&:hover {
color: pink
}
}
}
}
andreas
The & is a placeholder for the parent selector:
.parent {
& > ul {
color: red
}
}
Is the same like
.parent > ul {
color: red
}
A common use case are pseudo classes, e.g.:
.link {
&:hover {
color: red
}
}
A nice explanation with examples can be found on CSS Tricks.
来源:https://stackoverflow.com/questions/38804099/what-does-the-mean-in-an-scss-selector