Sass 允许将一套 CSS 样式嵌套进另一套样式中,内层的样式将它外层的选择器作为父选择器,例如:
#content div {
color: #00ff00;
width: 97%;
.notice {
background-color: red;
color: #000000;
}
}
css编译结果为:
#content div {
color: #00ff00;
width: 97%;
}
#content div .notice{
background-color: red;
color: #000000;
}
嵌套功能避免了重复输入父选择器,而且令复杂的 CSS 结构更易于管理。