什么是 Less?

  Less 是一门 CSS 预处理语言,它扩充了 CSS 语言,增加了诸如变量、混合(mixin)、嵌套、函数等功能,让 CSS 更易编写、维护等。

  本质上,Less 包含一套自定义的语法及一个解析器,用户根据这些语法定义自己的样式规则,这些规则最终会通过解析器,编译生成对应的 CSS 文件。

  例子:

/*嵌套*/
.box {
color: #fe33ac;
border-color:#fdcdea;
div { font-size:16px } }

  Less可以运行在Node、浏览器和Rhino平台上,

使用 Less 的意义?

  改变传统样式的编写方式,以面向对象的方式编写;

  变量、函数、嵌套的使用,提高开发效率。

如何使用 Less ?

1.在服务端,如Node.js,有专门的 less 编译模块。

2.在客户端,从LESS官网下载 less.js文件,然后再html页面引入。

  <link rel="stylesheet/less" type="text/css" href="styles.less" />  按less语法写的样式

  <script src="less.js" type="text/javascript"></script>  less文件解析器,使采用less语法写的样式能正常工作。

3.使用第三方工具等,把 .less文件编译成 .css文件再使用。(与1.Node.js处理less文件同理)

  (本文仅供学习交流使用~)

随机推荐

  1. nginx-配置反向代理实例

    nginx反向代理配置及优化 2009-05-26 作者:守住每一天blog:liuyu.blog.51cto.combbs:bbs.linuxtone.orgmsn:liuyubj520#hotma ...

  2. HDU_1394_Minimum Inversion Number_线段树求逆序数

    Minimum Inversion Number Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java ...

  3. ubuntu下Fiddler抓包

    参考 https://www.cnblogs.com/jcli/p/4474332.html https://www.jianshu.com/p/4505c732e378 1. 你要有个Mono环境, ...

  4. SpringMVC知识点总结一(非注解方式的处理器与映射器配置方法)

    一.SpringMVC处理请求原理图(参见以前博客) 1.  用户发送请求至前端控制器DispatcherServlet 2.  DispatcherServlet收到请求调用HandlerMappi ...

  5. 原型链、构造函数、箭头函数、se6数组去重

    原型链 例子如下: var arr = [1, 2, 3]; 其原型链为:arr ----> Array.prototype ----> Object.prototype ----> ...

  6. 洛谷——P2342 叠积木

    P2342 叠积木   题目大意:   给你一堆积木,排成一行,初始时每对积木都只有一个,支持两种操作  第一种是移动操作,格式为“移动X到Y的上面”.X和Y代表两块积木的编号,意思是将X所的那堆积 ...

  7. SQL上门2

    SQL高级教程学习 MySQL的字符匹配和其他数据库不同,一下语句查找(第一个字符不是h,第三个字符是m)不能用“!” select * from country where countryname ...

  8. Scrapy——6 APP抓包—scrapy框架下载图片

    Scrapy——6 怎样进行APP抓包 scrapy框架抓取APP豆果美食数据 怎样用scrapy框架下载图片 怎样用scrapy框架去下载斗鱼APP的图片? Scrapy创建下载图片常见那些问题 怎 ...

  9. 敏捷开发系列学习总结(2)——Bug修改流程

    原则,力求各司其职,简单明了. 1. 测试人员提交bug ⑴ 标题: [ 模块名称 ] 问题描述 ⑵ 内容: 问题重现步骤的描述,最好贴上图片. 因为一图胜万言. ⑶ 指定责任人: 根据bug指定责任 ...

  10. broker监控dataguard配置

    使用broker查看dataguard信息时有告警 DGMGRL> show configuration; Configuration - DRTEST Protection Mode: Max ...