CSS 预处理器 less、stylus、sass

sass和stylus 利用缩进换行空格减少要输入的字符

1、基本：

less	sass 和 stylus
.nav {     height: 300px; }	.nav     height: 300px;

2、嵌套：

less	sass 和 stylus
.nav {     &.nav-one {         height: 300px;      } }	.nav    &.nav-one        height: 300px;

3、变量：

less	sass		stylus
@color：  #0000; .nav {     color： @color }	$color： #0000; .nav     color： $color		color =  #0000 .nav     color： color

 

4、混入

less	sass		stylus
定义：   .nav1 (@color: red) {       color: @color      } 混入:     .nav {        .nav1(red)    }	定义： @mixin .nav1 {    color: red } 混入： .nav {    @include  .nav1 }		color =  #0000 .nav     color： color