更多函数请查看官方文档:less英文官方文档
@rules:{
color:red;
};
@lists:1,2,3,4,5,6;
p{
//isnumber:是否是数字;
padding-right:isnumber(#ff0);
padding-left:isnumber(12px);
//isstring是否是字符串
width:isstring("string");
//isurl是否是url
height:isurl(url("www.baidu.com"));
//iskeyword是否是关键字
margin-bottom: iskeyword(keyword);
//iscolor是否是颜色
color: iskeyword(#fff);
//ispixel是否是px
padding-top:ispixel(56px);
//isem是否是em
padding-bottom: isem(7.8em);
//ispercentage是否是percent
marker-end:ispercentage(7.8%) ;
//isunit单位是否匹配
margin-top:isunit(11px, px);
//max:找出最小值;
margin-left: min(1,5,9,0);
//max:找出最大值;
content:max(10,5,6);
//mod求余运算,返回第一个参数的单位
margin-right:mod(26px,5cm);
//pow返回x的y次方,返回第一个参数的单位
border-left:pow(25,0.5) ;
//pi
border-right:pi();
//atan计算反正切函数返回以弧度表示的数字
border-bottom:atan(0);
//tan计算正切函数
border-top:tan(1grad);
//acos计算反余弦函数返回以弧度表示的数字
border-top-left:acos(0.5);
//cos计算余弦函数
border-top-right:cos(120deg);
//asin计算反正弦函数返回以弧度表示的数字
border-bottom-left:asin(1);
//sin计算正弦函数
border-bottom-right:sin(120deg);
//sqrt计算数字的平方根
box-sizing: sqrt(25);
//abs计算数字的绝对值
border-top-right-radius: abs(-25);
//round(m,n)将m四舍五入到第n位
border-bottom-right-radius:round(0.255,2);
//percentage将浮点数转换为百分比字符串
border-bottom-left-radius:percentage(0.5);
//floor向下取整
border-top-left-radius:floor(2.6);
//ceil向上取整
border-top-radius:ceil(2.6);
/*hsl
根据色相,饱和度和亮度(HSL)值创建不透明的颜色对象。
参数:
hue:整数0-360,代表度。
saturation:百分比0-100%或数字0-1。
lightness:百分比0-100%或数字0-1。*/
border-right-radius: hsl(180,0.5,0.5);
// 如果要基于另一种颜色的通道创建新颜色,这将很有用,
//计算颜色对象的亮度
border-bottom-radius: luma(rgb(100, 200, 30));
//在不进行伽玛校正的情况下计算亮度值
border-left-radius:luminance(rgb(100, 200, 30));
//length返回值列表中的元素数
overflow:length(@lists);
//extract返回列表中指定位置的值
overflow-x:extract(@lists, 3);
//range生成跨越一系列值的列表
overflow-y: range(1,5,2);
//color指定颜色的字符串
border-top-style:color("#aaa");
//image-size获取图片尺寸
border-right-style:image-size("./0.jpg");
//lighten将HSL颜色空间中的颜色亮度绝对增加
border-bottom-style:lighten(hsl(90, 80%, 50%), 20%);
//overlay结合了的效果multiply和screen。有条件地使光通道变亮,而黑暗通道变暗
border-left-style:overlay(#ff6600, #333333);
//softlight类似于overlay但避免纯黑色导致纯黑色,而纯白色导致纯白色
border-top-right-style:softlight(#ff6600, #333333);
//multiply将两种颜色相乘。两种颜色中每种颜色的对应RGB通道相乘然后除以255
text-overflow:multiply(#000000,#feae58);
//screen做与multiply相反的事情
overflow-wrap:screen(#ff6600, #333333);;
}