less12 函数

简介:

less

复制代码
.x(1) {  x:11 }
.x(2) { y:22 }
.x(@x:1) when (default()) {z:@x}   //default()表示一直为真
body{
  background: color("#f60");
  width: convert(1s,ms);
  background: data-uri('arr.jpg');
}
.div1{
  .x(1);
}
.div2{
  .x(123);
}
.div3{
  .x();
}

.x1(@x) when (ispixel(@x)) {width:@x}
.x1(@x) when not(default()) {padding:(@x/10)}  //default()是一直为真

.div1{
  .x1(100px)
}

.div2{
  .x1(100cm);
  color:red;
}


div{
  width: unit(100px,cm);
}
div{
  width: unit(100px);
}
复制代码

css

复制代码
body {
  background: #ff6600;
  width: 1000ms;
  background: url('arr.jpg');
}
.div1 {
  x: 11;
}
.div2 {
  z: 123;
}
.div3 {
  z: 1;
}
.div1 {
  width: 100px;
  padding: 10px;
}
.div2 {
  color: red;
}
div {
  width: 100cm;
}
div {
  width: 100;
}
复制代码

 less

复制代码
div{
  d:escape('#, ^, (, ), {, }, |, :, >, <, ;, ], [ , =');//编码处理
  filter: e("ms:alwaysHasItsOwnSyntax.For.Stuff()");    //原样输出
  filter: ~"ms:alwaysHasItsOwnSyntax.For.Stuff()";    //原样输出
  width: calc(960px-100px);
  width: calc(~'960px-100px');
  height: calc(~'960px-100px');
  font-family: %( "%a %a" , "Microsoft", "YaHei");    //格式化字符串
  font-family: ""Microsoft" "YaHei"";

  font-family: %( "%A %a" , "Microsoft", "YaHei");
  font-family: "%22Microsoft%22 "YaHei"";    //引号用%22替代

  font-family: %( "%s %s" , F60, "YaHei");

  font-family: %( "%s %s" , "Microsoft", "YaHei");
  font-family: "Microsoft YaHei";

  content: replace("Hello, maizi", "maizi", "LESS");
  content: replace("Hello, A", "A", "B");

  n:length(1px solid #0080ff);

  @list: "A", "B", "C", "D";
  n:extract(@list,4)
}
复制代码

css

复制代码
div {
  d: %23,%20%5E,%20%28,%20%29,%20%7B,%20%7D,%20%7C,%20%3A,%20%3E,%20%3C,%20%3B,%20%5D,%20%5B%20,%20%3D;
  filter: ms:alwaysHasItsOwnSyntax.For.Stuff();
  width: calc(860px);
  width: calc(960px-100px);
  height: calc(960px-100px);
  font-family: ""Microsoft" "YaHei"";
  font-family: "" Microsoft " " YaHei "";
  font-family: "%22Microsoft%22 "YaHei"";
  font-family: "%22Microsoft%22 " YaHei "";
  font-family: "F60 YaHei";
  font-family: "Microsoft YaHei";
  content: "Hello, LESS";
  content: "Hello, B";
  n: 3;
  n: "D";
}
复制代码

 less

复制代码
div{
  width1: ceil(2.9999999px);   //1.ceil()函数  向上取整
  width2: floor(2.9999999px);   //1.floor()函数  向下取整
  width3:percentage(0.5px);  //将浮点数转换为百分比

//  取整和四舍五入
  width4:4.5px ;
  width5:round(4.5px) ;

  width6:4.4px ;
  width7:round(4.4px) ;

//  计算一个数的平方根,原样保持单位。
  width8: sqrt(16px);
  width9: sqrt(9px);

//  计算数字的绝对值,原样保持单位。
  top10: -999px;
  top11: abs(-999px);

  width12: sin(1);  //1弧度角的正弦值
  width13: sin(1deg);//1角度角的正弦值
  width14: sin(1grad); //1百分度角的正弦值

//  反正弦值
  width15: asin(-0.84147098);
  width16: asin(0);
  width17: asin(2);


    width18: cos(1);  //1弧度角的余弦值
    width19: cos(1deg);//1角度角的余弦值
    width20: cos(1grad); //1百分度角的余弦值

  width21: tan(1);  //1弧度角的正切值
  width22: tan(1deg);//1角度角的正切值
  width23: tan(1grad); //1百分度角的正切值

//  PI
  width24: pi();

//  乘方运算
  width25: pow(2px,2);
  width26: pow(3px,2);
  width27: pow(4px,2);
  width28: pow(25px,0.5);

//  mod()取余
  width29: mod(3px,2);

  width30: min(3px,2px,1px);
  width31: max(3px,2px,1px);
}
复制代码

css

复制代码
div {
  width1: 3px;
  width2: 2px;
  width3: 50%;
  width4: 4.5px ;
  width5: 5px;
  width6: 4.4px ;
  width7: 4px;
  width8: 4px;
  width9: 3px;
  top10: -999px;
  top11: 999px;
  width12: 0.84147098;
  width13: 0.01745241;
  width14: 0.01570732;
  width15: -0.99999999rad;
  width16: 0rad;
  width17: NaNrad;
  width18: 0.54030231;
  width19: 0.9998477;
  width20: 0.99987663;
  width21: 1.55740772;
  width22: 0.01745506;
  width23: 0.01570926;
  width24: 3.14159265;
  width25: 4px;
  width26: 9px;
  width27: 16px;
  width28: 5px;
  width29: 1px;
  width30: 1px;
  width31: 3px;
}
复制代码

 less

复制代码
//如果一个值是一个数字,返回'真(true)',否则返回'假(false)'.
.m(@x) when (isnumber(@x)) {
  x:@x
}
div{
.m(123);
.m(ABC);
}

//如果一个值是一个字符串,返回'真(true)',否则返回'假(false)'.
.m1(@x) when (isstring(@x)) {
  x:@x
}
div1{
.m1(123);
.m1("ABC");
}

//如果一个值是一个颜色,返回'真(true)',否则返回'假(false)'.
.m2(@x) when (iscolor(@x)) {
  x:@x
}
div2{
  .m2(123);
  .m2("ABC");
  .m2(red);
}

//如果一个值是一个关键字,返回'真(true)',否则返回'假(false)'.
.m3(@x) when (iskeyword(@x)) {
  x:@x
}
div3{
  .m3(123);
  .m3("ABC");
  .m3(red);
  .m3(ABC);
}

//如果一个值是一个url地址,返回'真(true)',否则返回'假(false)'.
.m4(@x) when (isurl(@x)) {
  x:@x
}
div4{
  .m4(123);
  .m4("ABC");
  .m4(red);
  .m4(ABC);
  .m4(url(arr.jpg));
}

//如果一个值是带像素长度单位的数字,返回'真(true)',否则返回'假(false)'.
.m5(@x) when (ispixel(@x)) {
  x:@x
}
div5{
  .m5(123);
  .m5("ABC");
  .m5(red);
  .m5(ABC);
  .m5(url(arr.jpg));
  .m5(220px);
  .m5(220cm);
}

//如果一个值是带em长度单位的数字,返回'真(true)',否则返回'假(false)'.
.m6(@x) when (isem(@x)) {
  x:@x
}
div6{
  .m6(123);
  .m6("ABC");
  .m6(red);
  .m6(ABC);
  .m6(url(arr.jpg));
  .m6(220px);
  .m6(240em);
}

//如果一个值是带百分比单位的数字,返回'真(true)',否则返回'假(false)'.
.m7(@x) when (ispercentage(@x)) {
  x:@x
}
div7{
  .m7(123);
  .m7("ABC");
  .m7(red);
  .m7(ABC);
  .m7(url(arr.jpg));
  .m7(220px);
  .m7(240em);
  .m7(260%);
}

//如果一个值是带指定单位的数字,返回'真(true)',否则返回'假(false)'.
.m8(@x) when (isunit(@x,em)) {
  x:@x
}
div8{
  .m8(123);
  .m8(220px);
  .m8(240em);
  .m8(280em);
  .m8(290em);
  .m8(260%);
}
复制代码

css

复制代码
div {
  x: 123;
}
div1 {
  x: "ABC";
}
div2 {
  x: #ff0000;
}
div3 {
  x: ABC;
}
div4 {
  x: url(arr.jpg);
}
div5 {
  x: 220px;
}
div6 {
  x: 240em;
}
div7 {
  x: 260%;
}
div8 {
  x: 240em;
  x: 280em;
  x: 290em;
}
复制代码

 



本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/7001790.html,如需转载请自行联系原作者
相关文章
|
4月前
|
程序员 编译器 C++
函数介绍
函数介绍
23 1
|
1月前
|
Java 测试技术 Python
为什么要用函数
在编程中,函数是一种重要的抽象工具,它使我们能够组织和复用代码,提高代码的可读性、可维护性和效率。函数允许我们将一段代码块封装起来,给它一个名字,并通过参数和返回值来与外部世界交互。下面,我们将深入探讨为什么要使用函数,并附上相应的代码示例。
15 1
|
7月前
MQTTClient_setCallbacks()函数
MQTTClient_setCallbacks()
459 0
|
8月前
|
算法 程序员 信息无障碍
从零带你认识函数(二)
从零带你认识函数
61 1
|
8月前
|
前端开发
纯函数
纯函数
51 0
|
9月前
|
算法 编译器
函数(2)
函数(2)
|
JavaScript 前端开发 API
h函数为什么叫h?
h函数为什么叫h?
198 0
|
C语言
可变长参数函数
可变长参数函数
99 0
|
JSON JavaScript 前端开发
6、函数
JavaScript 有三种声明函数的方法。
106 0

热门文章

最新文章