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;}
  • 相关阅读:
    [题解] P2513 [HAOI2009]逆序对数列
    [题解]洛谷P2709 小B的询问
    题解 P1944 最长括号匹配_NOI导刊2009提高(1)
    [题解]SP703 SERVICE
    Bzoj2427: [HAOI2010]软件安装
    【题解】UVA11362 Phone List
    【题解】P2922 [USACO08DEC]秘密消息Secret Message
    Tire树的学习
    【题解】P1171 售货员的难题
    计算机与编程资源教程汇总
  • 原文地址:https://www.cnblogs.com/wymbk/p/5765078.html
Copyright © 2011-2022 走看看