zoukankan      html  css  js  c++  java
  • Less安装与使用

    Less是一门CSS预处理语言,它扩展了CSS语言,增加了变量、Mixin、函数等特性,使CSS更易维护和拓展.(less可以运行在node或浏览器端)

    首先:安装+配置环境

    在node.js中通过它的js包管理器(npm),进行下载  执行命令----->

    npm install -g less    ,也可以吧他

    $ npm install -g less

    ,如图

    下载完成后,你就可以在你安装的Node.js的子文件加中的node_modules中找到less,代表你安装完成。

    既然安装完成了,那么接下来就是less的编辑与压缩了,

    通过二部曲进行编辑压缩---》

    1.在项目的子文件夹中创建一个.less文本,并从node中选中要操作的less文本生成CSS:

      输入node命令:lessc style.less     ----->选择编译的less文件     需要输入路径,根目录(C:Usersuserstyle.less') 

     如图,例:我在E盘的根目录下创建一个项目,名为test,test下创建less文件夹并在目录下创建less文本(可以往其中填部分内容做测试),从node中切换到该文件。

      图1,less内容中填写的内容: 

    @color: #E4393C;
    
    #header {
      color: @color;
    }
    nav{
     nav color: @color;
    }

      图2,切换到style.less文件并转化成style.css

      图3,生成.css文件:

      图4,less文件中内容

    #header {
      color: #E4393C;
    }
    nav {
      color: #E4393C;
    }

    2.继续选中该文件,并根据指令压缩为.min格式    

     指令------》lessc style.css -x

    #header{color:#E4393C;}nav{color:E4393c;}
  • 相关阅读:
    hdu 5446 Unknown Treasure lucas和CRT
    Hdu 5444 Elven Postman dfs
    hdu 5443 The Water Problem 线段树
    hdu 5442 Favorite Donut 后缀数组
    hdu 5441 Travel 离线带权并查集
    hdu 5438 Ponds 拓扑排序
    hdu 5437 Alisha’s Party 优先队列
    HDU 5433 Xiao Ming climbing dp
    hdu 5432 Pyramid Split 二分
    Codeforces Round #319 (Div. 1) B. Invariance of Tree 构造
  • 原文地址:https://www.cnblogs.com/wymbk/p/5765078.html
Copyright © 2011-2022 走看看