less的安装使用和入门实践
1、简介
LESSCSS是一种动态样式语言,属于CSS预处理语言的一种,它使用类似CSS的语法,为CSS的赋予了动态语言的特性,如变量、继承、运算、函数等,更方便CSS的编写和维护。
LESSCSS可以在多种语言、环境中使用,包括浏览器端、桌面客户端、服务端。
具体语言特性详见:http://www.bootcss.com/p/lesscss/
2、LESS的安装
less安装分为两种:客户端和服务器端
a、客户端安装
在官网下载一个JavaScript 脚本文件“less.js”,然后在需要引入LESS源文件的html的<head>中加入如下的代码
<link rel="stylesheet/less" type="text/css" href="/styles.less">
<script src="/less.js" type="text/javascript"></script>
这里要注意,在引入“.less”文件时,“link”的“rel”属性要设置为“stylesheet/less”。
还要注意:less源文件一定要在“less.js”引入之前引入,这样才能保证LESS源文件正确编译解析。
b、服务器端安装
利用node的包管理器(npm)安装LESS
1、首先到Node JS的官网下载一个适合Windows 系统的安装文件

2、打开.msi文件,运行


3、检查path环境变量是否配置了Node.js,点击开始=》运行=》输入cmd=》输入命令“path”,输出结果如下

4、启动Node Js的command 控制面板直接输入命令:
$ npm install less


找到你要编译的less文件目录,编译less文件,输入如下命令:
$ lessc color.less > color.css
这时候就在文件夹下生成了 .css文件。
c、除了上面的命令转译LESS源文件之外,还有一个第三方开发的工具,比较常用的是WinLess工具,简单易用
下载地址:http://winless.org/

点击Add folder,添加要编译的less文件目录,右侧加载less文件,如果没有加载好,点击右侧窗口的Refresh,刷新目录结构。
选中要编译的less文件,compile 完成编译,如果less文件有错误,编译会失败报错,成功编译会在文件下生成相应的.css文件。

less的安装使用和入门实践的更多相关文章
- sass、less和stylus的安装使用和入门实践
刚 开始的时候,说实话,我很反感使用css预处理器这种新玩意的,因为其中涉及到了编程的东西,私以为很复杂,而且考虑到项目不是一天能够完成的,也很少是 一个人完成的,对于这种团队的项目开发,前端实践用c ...
- Azure DevOps Server 入门实践与安装部署
一,引言 最近一段时间,公司希望在自己的服务器上安装本地版的 Azure DevOps Service(Azure DevOps Server),用于项目内的测试,学习.本着学习的目的,我也就开始学习 ...
- 分布式学习系列【dubbo入门实践】
分布式学习系列[dubbo入门实践] dubbo架构 组成部分:provider,consumer,registry,monitor: provider,consumer注册,订阅类似于消息队列的注册 ...
- Django入门实践(三)
Django入门实践(三) Django简单应用 前面简单示例说明了views和Template的工作过程,但是Django最核心的是App,涉及到App则会和Model(数据库)打交道.下面举的例子 ...
- Django入门实践(一)
Django入门实践(一) Django编程思路+入门 认识Django有一个多月了,我觉得学习Django应该先理清它的编程思路.它是典型的MVC框架(在Django里也称MTV),我觉得Djang ...
- kubernetes入门实践
k8s中文文档 k8s概念比较多,有什么概念的疑惑的推荐看k8s中文文档. me的环境 操作系统:centos7 docker:1.12.6 环境跟me的不一致?不要慌,基本大部分操作都是行的通的. ...
- 全文搜索引擎Elasticsearch入门实践
全文搜索引擎Elasticsearch入门实践 感谢阮一峰的网络日志全文搜索引擎 Elasticsearch 入门教程 安装 首先需要依赖Java环境.Elasticsearch官网https://w ...
- 20165223 Linux安装及命令入门
预备作业3:Linux安装及命令入门 一.VirtualBox和Ubuntu的安装 通过学习实践基于VirtualBox虚拟机安装Ubuntu图文教程,我开始学习虚拟机的安装,根据教程一步步试着安装. ...
- 【实战】Docker入门实践二:Docker服务基本操作 和 测试Hello World
操作环境 操作系统:CentOS7.2 内存:1GB CPU:2核 Docker服务常用命令 docker服务操作命令如下 service docker start #启动服务 service doc ...
随机推荐
- C 语言经典100例
C 语言经典100例 C 语言练习实例1 C 语言练习实例2 C 语言练习实例3 C 语言练习实例4 C 语言练习实例5 C 语言练习实例6 C 语言练习实例7 C 语言练习实例8 C 语言练习实例9 ...
- remove-duplicates-from-sorted-array-ii——去除重复
Follow up for "Remove Duplicates":What if duplicates are allowed at most twice? For exampl ...
- eclipse 如何把java项目转成web项目
经常在eclipse中导入web项目时,出现转不了项目类型的问题,导入后就是一个java项目. 解决步骤: 1.进入项目目录,可看到.project文件,打开. 2.找到<natures> ...
- Mongo JavaTest
import com.mongodb.MongoClient; import com.mongodb.DB; import com.mongodb.DBCollection; import com.m ...
- 自定义带下划线文本的UIButton
转载自 http://mobile.51cto.com/hot-404798.htm,略有改动 UnderLineButton.h代码 @interface UnderLineButton : UIB ...
- 提升Web性能的技巧
1. 采用反向代理服务器(Reverse Proxy Server)来对应用进行加速和保护 其作用主要在以下三方面: 负载平衡 – 运行在反向代理服务器上的负载平衡器会在不同的不服务器 间进行传输 ...
- Struts2学习四----------动态方法调用
© 版权声明:本文为博主原创文章,转载请注明出处 Struts2动态方法调用 - 默认:默认执行方法中的execute方法,若指定类中没有该方法,默认返回success <package nam ...
- arcgis水文分析
前言 1.在开始之前首先需要注意几点: 1.arcgis 需要 python2.7 的支持,并有必要的模块库,请一定注意避免与其他软件冲突,例如tecplot 2009 需要python2.5的支持, ...
- grunt前端打包——css篇
[导读] 前端打包的工具有很多,我用的习惯的就是这个grunt,无论是你要在github上做开源,还是让自己的项目变得更易于维护,grunt都是首选. 前端打包的工具有很多,我用的习惯的就是这个gru ...
- TOML简介 (转)
TOML的由来 配置文件的使用由来已久,从.ini.XML.JSON.YAML再到TOML,语言的表达能力越来越强,同时书写便捷性也在不断提升. TOML是前GitHub CEO, Tom Prest ...