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 ...
随机推荐
- 线程安全的概念和Synchronized(读书笔记)
并行程序开发的一大关注重点就是线程安全,一般来说,程序并行化为了获取更多的执行效率,但前提是,高效率不能以牺牲正确性为代价,线程安全就是并行程序的根本和根基.volatile并不能真正保证线 ...
- Android设计中的尺寸问题
Android把屏幕大小分成四种:small, normal, large, xlarge; 屏幕密度分成:low(ldpi), medium(mdpi), high(hdpi), extra hig ...
- vue Object.freeze() 优化
参考自:https://segmentfault.com/a/1190000006191558 Object.freeze()是ES5新增的特性,可以冻结一个对象,防止对象被修改. vue 1.0.1 ...
- Asp 解析 XML并分页显示
Asp 解析 XML并分页显示 Asp 解析 XML并分页显示,演示样例源代码例如以下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...
- oracle 使用job定时自动重置sequence
一.赋予用户创建和删除sequence的权限 grant create any sequence to user_name; grant drop any sequnce to user_name; ...
- Node.js学习笔记(3)——关于回调函数和函数的回调
说明:本人是node.js的初学者,尝试向别人解释这是怎么回事是自我学习的一个好方法.如果你发现有些地方并不是那么正确,欢迎提出来让我知道以便修正,共同进步,谢过^_^. 欢迎交流,本人微 ...
- ubuntu 安装 rpm 软件包
1.首先安装alien和fakeroot这两个软件,alien可以将rpm转换为deb包.命令sudo apt-get install alien fakeroot 2.使用alien将rpm包转为d ...
- List集合的遍历方法
估计你永远都不会忘记这三个方法了...... public static void main(String[] args) { //超级for循环遍历方法 List<String> lis ...
- 前端PC页面,移动端页面问题笔记~~
<!DOCTYPE html> <html> <head> <meta charset="gbk"/> <meta name= ...
- nodejs初学-----helloworld
近期紧锣密鼓的学习了下nodejs(之前在学php.算入门了吧,可是时间关系,还没写文章,兴许要搞安卓和大数据,总之比較忙哈,计划上php要排到后面了,还请广大小伙伴不要着急) 先抄一句:Node.j ...