SASS(二)
样式规则(Style Rules) 总览 和css一样,样式规则是Sass的基础,原理也差不多:用选择器选择你所要改变样式的元素,然后声明一些属性去决定它的样式。 Sass: .button { padding: 3px 10px; font-size: 12px; border-radius: 3px; border: 1px solid #e1e4e8; } css: .button { padding: 3px 10px; font-size: 12px; border-radius: 3px; border: 1px solid #e1e4e8; } 1)嵌套(Nesting) 当然Sass致力于让码生幸福,不会让我们一遍又一遍地去写重复的选择器,所以你可以写嵌套样式,Sass会自动把外层选择器和内层样式规则结合起来。 Sass: nav { ul { margin: 0; padding: 0; list-style: none; } li { display: inline-block; } a { display: block; padding: 6px 12px; text-decoration: none; } } css: nav ul { margin: 0; padding: 0; list-style: none; } nav li {