Scss sass

Posted 2020-06-29 jayruan

http://www.ruanyifeng.com/blog/2012/06/sass.html
scss 声明:
1,$blue : #1875e7;
2,
.class1 {
　　　　border: 1px solid #ddd;
}
3,
@mixin left ($value: 10px){
　　　　float: left;
　　　　margin-left: $value;
　　}

附值：
1,color:$blue
1.1,border-#{$side}-radius
2,　
.class2 {
　　　　@extend .class1;
　　　　font-size:120%;
　　}
3,div {
　　　　@include left(20px);
　　}

　　@mixin rounded($vert, $horz, $radius: 10px) {
　　　　border-#{$vert}-#{$horz}-radius: $radius;
　　　　-moz-border-radius-#{$vert}#{$horz}: $radius;
　　　　-webkit-border-#{$vert}-#{$horz}-radius: $radius;
　　}
　#navbar li { @include rounded(top, left); }
#footer { @include rounded(top, left, 5px); }

@function double($n) {
　　　　@return $n * 2;
　　}
　　#sidebar {
　　　　width: double(5px);
　　}