最赞回答 / rookie_r
$social-color就是$social-colors值列表里面的值,$social-network是$social-colors值列表里面的键,
lighten($bgcolor,.1);和lighten($bgcolor,10%)编译不同,编译值分别是
color: #ff3434;
border-color: #ff6666;,
总结:编译解析后一个参数小数为透明度值,百分数为亮度比重值。
测试验证:
.test {
border-color: rgba($bgcolor,.1);
}
编译为border-color: rgba(255, 51, 51, 0.1);与十六进制#FF3434在G和B的颜色值上差1.
color: #ff3434;
border-color: #ff6666;,
总结:编译解析后一个参数小数为透明度值,百分数为亮度比重值。
测试验证:
.test {
border-color: rgba($bgcolor,.1);
}
编译为border-color: rgba(255, 51, 51, 0.1);与十六进制#FF3434在G和B的颜色值上差1.
2017-04-26
发现写
.btn {
background-color: $bgcolor;
border-color: lighten($bgcolor,10%);
color: lighten($bgcolor,.1);
}
编译不同
.btn {
background-color: $bgcolor;
border-color: lighten($bgcolor,10%);
color: lighten($bgcolor,.1);
}
编译不同
2017-04-26
@mixin border($type){
border:#{1px } if($type,solid,dash) #{ red}
}
.a{
@include border(true);
}
.b{
@include border(false);
}
border:#{1px } if($type,solid,dash) #{ red}
}
.a{
@include border(true);
}
.b{
@include border(false);
}
2017-04-22