js中less常用的方法小结


Posted in Javascript onAugust 09, 2017

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 相关文章推荐
javascript两种function的定义介绍及区别说明
May 02 Javascript
javascript获取select标签选中的值
Jun 04 Javascript
判断数组的最佳方法(推荐)
Oct 11 Javascript
javascript的document中的动态添加标签实现方法
Oct 24 Javascript
快速入门Vue
Dec 19 Javascript
JavaScript中数据类型转换总结
Dec 25 Javascript
深入浅析ES6 Class 中的 super 关键字
Oct 20 Javascript
javascript显示动态时间的方法汇总
Jul 06 Javascript
Vue-不允许嵌套式的渲染方法
Sep 13 Javascript
JavaScript函数重载操作实例浅析
May 02 Javascript
js根据后缀判断文件文件类型的代码
May 09 Javascript
JavaScript位置参数实现原理及过程解析
Sep 14 Javascript
利用JS做网页特效_大图轮播(实例讲解)
Aug 09 #Javascript
基于Vue实例对象的数据选项
Aug 09 #Javascript
react-native之ART绘图方法详解
Aug 08 #Javascript
jQuery Easyui Treegrid实现显示checkbox功能
Aug 08 #jQuery
jQuery EasyUI的TreeGrid查询功能实现方法
Aug 08 #jQuery
EasyUI的TreeGrid的过滤功能的解决思路
Aug 08 #Javascript
angular+ionic返回上一页并刷新页面
Aug 08 #Javascript
You might like
PHP网页游戏学习之Xnova(ogame)源码解读(十五)
2014/06/30 PHP
php实现可逆加密的方法
2015/08/11 PHP
php array_udiff_assoc 计算两个数组的差集实例
2016/11/12 PHP
PHP中危险的file_put_contents函数详解
2017/11/04 PHP
PHP7扩展开发之基于函数方式使用lib库的方法详解
2018/01/15 PHP
TP5框架model常见操作示例小结【增删改查、聚合、时间戳、软删除等】
2020/04/05 PHP
数理公式,也可以这么唯美
2021/03/10 无线电
在你的网页中嵌入外部网页的方法
2007/04/02 Javascript
JavaScript的类型转换(字符转数字 数字转字符)
2010/08/30 Javascript
iframe 上下滚动条如何默认在下方实现原理
2012/12/10 Javascript
JS上传图片前的限制包括(jpg jpg gif及大小高宽)等
2012/12/19 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(二)人物行走的实现
2013/01/23 Javascript
jQuery匹配文档链接并添加class的方法
2015/06/26 Javascript
JS+CSS实现电子商务网站导航模板效果代码
2015/09/10 Javascript
jquery实现拖动效果(代码分享)
2017/01/25 Javascript
文本溢出插件jquery.dotdotdot.js使用方法详解
2017/06/22 jQuery
H5+C3+JS实现五子棋游戏(AI篇)
2020/05/28 Javascript
Vue组件间通信方法总结(父子组件、兄弟组件及祖先后代组件间)
2019/04/17 Javascript
Vue实现根据hash高亮选项卡
2019/05/27 Javascript
JS函数本身的作用域实例分析
2020/03/16 Javascript
wxPython框架类和面板类的使用实例
2014/09/28 Python
Python脚本实现格式化css文件
2015/04/08 Python
Python的Django框架中settings文件的部署建议
2015/05/30 Python
python获取一组汉字拼音首字母的方法
2015/07/01 Python
python3实现磁盘空间监控
2018/06/21 Python
python版opencv摄像头人脸实时检测方法
2018/08/03 Python
python3用PIL把图片转换为RGB图片的实例
2019/07/04 Python
OpenCV3.0+Python3.6实现特定颜色的物体追踪
2019/07/23 Python
使用matplotlib动态刷新指定曲线实例
2020/04/23 Python
Python selenium环境搭建实现过程解析
2020/09/08 Python
JINS眼镜官方网站:日本最大的眼镜邮购
2016/10/14 全球购物
综合实践活动总结
2014/05/05 职场文书
2014年学生会主席工作总结
2014/11/07 职场文书
2015年收银工作总结范文
2015/04/01 职场文书
2015暑假社会调查报告
2015/07/13 职场文书
浅谈克隆 JavaScript
2021/11/02 Javascript