Sass 中还提供属性嵌套,CSS 有一些属性前缀相同,只是后缀不一样,比如:border-top/border-right,与这个类似的还有 margin、padding、font 等属性。假设你的样式中用到了:
.box { border-top: 1px solid red; border-bottom: 1px solid green; }
在 Sass 中我们可以这样写:
.box { border: { top: 1px solid red; bottom: 1px solid green; } }
在编辑器第 2 行、3 行和第 4 行输入正确的代码,使其编译出来的 CSS 如下:
.box { font-size: 12px; font-weight: bold; }
.box { ?: { ?: 12px; ?: bold; } }