最贊回答 / 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