js中less常用的方法小结

 更新时间:2017年08月09日 08:16:56   投稿:jingxian  
下面小编就为大家带来一篇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))min max等数学方法

6、saturate(@value,20%)增加饱和度 desaturate(@value,20%)增加饱和度 lighten 增加亮度 darken降低亮度 fadein 增加透明度 fadeout 降低透明度 fade设置透明度 greyscale 完全移除饱和度变为灰度

以上这篇js中less常用的方法小结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • JavaScript Canvas绘制圆形时钟效果

    JavaScript Canvas绘制圆形时钟效果

    这篇文章主要为大家详细介绍了JavaScript Canvas绘制圆形时钟效果的相关资料,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-04-04
  • JavaScript打印网页指定区域的例子

    JavaScript打印网页指定区域的例子

    这篇文章主要介绍了JavaScript打印网页指定区域的例子,需要的朋友可以参考下
    2014-05-05
  • js图片放大镜效果实现方法详解

    js图片放大镜效果实现方法详解

    这篇文章主要为大家详细介绍了js图片放大镜效果的实现方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-03-03
  • JavaScript的三种BOM对象

    JavaScript的三种BOM对象

    这篇文章主要为大家介绍了JavaScript BOM对象,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助<BR>
    2021-12-12
  • JS/jQuery判断DOM节点是否存在的简单方法

    JS/jQuery判断DOM节点是否存在的简单方法

    下面性价比就为大家带来一篇JS/jQuery判断DOM节点是否存在的简单方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起 小编过来看看吧
    2016-11-11
  • js实现鼠标跟随运动效果

    js实现鼠标跟随运动效果

    这篇文章主要为大家详细介绍了js实现鼠标跟随运动效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-09-09
  • JS实现li标签的删除

    JS实现li标签的删除

    这篇文章主要为大家详细介绍了JS实现li标签的删除,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-04-04
  • 浅谈JavaScript中的string拥有方法的原因

    浅谈JavaScript中的string拥有方法的原因

    这篇文章主要介绍了浅谈JavaScript中的string拥有方法的原因,需要的朋友可以参考下
    2015-08-08
  • js中apply()和call()的区别与用法实例分析

    js中apply()和call()的区别与用法实例分析

    这篇文章主要介绍了js中apply()和call()的区别与用法,结合实例形式分析了apply()和call()的功能、区别、使用方法及相关操作注意事项,需要的朋友可以参考下
    2018-08-08
  • Iphone手机、安卓手机浏览器控制默认缩放大小的方法总结(附代码)

    Iphone手机、安卓手机浏览器控制默认缩放大小的方法总结(附代码)

    这篇文章主要介绍了Iphone手机、安卓手机浏览器控制默认缩放大小的方法,通过meta标签中添加属性代码展示控制浏览器的默认缩放,具体操作步骤大家可查看下文的详细讲解,感兴趣的小伙伴们可以参考一下。
    2017-08-08

最新评论