Sass：基础用法学习笔记

子选择器(>)和同层选择器(+、~)

在css中

>选择直接后代

+选择同层第一个兄弟元素

~选择同层所有兄弟元素

article {

article { border-top: 1px dashed #ccc }

section { background: #eee }

dl > {

dt { color: #333 }

dd { color: #555 }

}

nav + & { margin-top: 0 }

}

编译后

article ~ article { border-top: 1px dashed #ccc }

article > footer { background: #eee }

article dl > dt { color: #333 }

article dl > dd { color: #555 }

nav + article { margin-top: 0 }

嵌套属性，相同前缀只需要写一遍

nav {

border: {

style: solid;

width: 1px;

color: #ccc;

}

}