zoukankan      html  css  js  c++  java
  • 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>
    View Code

    这里要注意,在引入“.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文件。

  • 相关阅读:
    用Java redis 实现发送手机验证码的功能
    redis之Java Jedis 的使用(使用maven引入)
    设计模式之代理模式
    Redis相关配置
    Redis五大数据类型
    设计模式之享元模式
    设计模式之外观模式
    设计模式之组合模式
    设计模式之装饰者模式
    设计模式之适配器模式
  • 原文地址:https://www.cnblogs.com/olivianate/p/5354695.html
Copyright © 2011-2022 走看看