less-条件表达式

//.mixin (@a) when (lightness(@a) >= 50%) {   //255/2=127.5
//  background-color: black;
//}
//.mixin (@a) when (lightness(@a) < 50%) {
//  background-color: white;
//}
//.mixin (@a) {
//  color: @a;
//}
//.class1 { .mixin(#7e7e7e) }  //221  > 127.5  >50%  background-color: black;  7e7e7e  =  126
//.class2 { .mixin(#808080) }  //85 <127.5  <50%   background-color: white;  808080 = 128

//iscolor,isnumber.....判断值得类型
//.mixin (@a) when (iscolor(@a)) {   //255/2=127.5
//  background-color: black;
//}
//.mixin (@a) when (isnumber(@a) ) {
//  background-color: white;
//  shuzi:shuzi;
//}
//.mixin (@a) {
//  color: @a;
//}
//.class1 { .mixin(#7e7e7e) }  //background-color: black;
//.class2 { .mixin(123) }  //background-color: white;


//ispixel,ispercentage.....单位检查函数
.mixin (@a) when (ispixel(@a)) {
  background-color: black;
}
.mixin (@a) when (ispercentage(@a) ) {
  background-color: white;
}
.mixin (@a) {
  width: @a;
}
.class1 { .mixin(960px) }  //background-color: black; width:960px
.class2 { .mixin(95%) }  //background-color: white;width:95%
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容