js中less常用的方法小结
1、color解析颜色把代表颜色的字符串转换为颜色值
@c:'#000'
.box{
background:color(@c)
}
2、data-uri把我们需要使用的素材图片转化成BASE64编码,项目中尤其是移动端的项目,节省了图片的加载时间,是图片优化的一个手段;LESS对于大图片是不能转码的,我们可以使用BASE64工具转码(tool.css-js.com)
项目中慎用,当你在移动端项目中有一些大图实在没有办法处理了的情况下在使用BASE64。
@c:'#000'
@url:'../img/banner';
.box{
background:data-uri('@{url}/banner1.jpg');
}
3、unit(去除单位和添加单位)
@w100:100px
.box{
width:unit(unit(@w100)-50,px)
}
4、length(长度)extract(提取)
@color:#000,#fff,#ccc,#eee;
.box{
z-index:length(@color);
background:extract(@color,length(@color));
}
5、ceil、floor、percentage、round、sqrt...mod(取余数(4,2))minmax等数学方法
6、saturate(@value,20%)增加饱和度desaturate(@value,20%)增加饱和度lighten增加亮度darken降低亮度fadein增加透明度fadeout降低透明度fade设置透明度greyscale完全移除饱和度变为灰度
以上这篇js中less常用的方法小结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持毛票票。