什么是 less? 如何使用 less?
什么是 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文件同理)
(本文仅供学习交流使用~)
随机推荐
- python编辑csv
import csv import time def timestamp_to_timestr(timeStamp): timeArray = time.localtime(int(timeStamp ...
- dubbo之配置规则
配置规则 向注册中心写入动态配置覆盖规则 1.该功能通常由监控中心或治理中心的页面完成. RegistryFactory registryFactory = ExtensionLoader.getEx ...
- Python元类(metaclass)以及元类实现单例模式
这里将一篇写的非常好的文章基本照搬过来吧,这是一篇在Stack overflow上很热的帖子,我看http://blog.jobbole.com/21351/这篇博客对其进行了翻译. 一.理解类也是对 ...
- ESLint =》tslint.json
结论:将ESLint提示注意()里面的规则属性在tslint.json中"rules": { } 里设置为false 1.ES6: ESLint提示"Require Ob ...
- 使用Flask+uWsgi的方式部署一个blog网站
本文参考以下文章:https://www.yukunweb.com/2017/12/ubuntu-nginx-uwsgi-flask-app/ 需要学习的地方 nginx+uwsgi部署flask应用 ...
- Linux判断
#字符串比较if [ "$1" == "判断条件" ] then echo "$1" elif [ "$1" == &q ...
- 39.date hitogram基础知识
主要知识点: date hitogram之统计每月电视销量 上一节讲到histogram,他是以数值进行分组.本节讲到以日期进行bucket分组操作,也就是说把连续的日期变成离散的日期区间,然 ...
- cuda npp库旋转图片
#include <stdio.h> #include <stdlib.h> #include <string.h> #include <assert.h&g ...
- hdu2008 数值统计【C++】
数值统计 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submis ...
- hdu2006 求奇数的乘积【C++】
求奇数的乘积 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Subm ...