zoukankan      html  css  js  c++  java
  • less 的简单使用

    (1)、在node.js环境下

    Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性,使 CSS 更易维护和扩展。

    Less 可以运行在 Node 或浏览器端。

    (使用方法):

    第一步:安装

    先下载配置Node环境 https://nodejs.org/en/在这下载,版本随意。。

    直接点击下一步就可以,安装好后,在node的命令提示符下完成此代码   

    npm install -g less
    

     第二步:测试

    安装完成后,在所建的HTML文件中,右键单击在集成终端中打开,出现提示符,打入以下代码,回车

    less -v
    

     第三步:新建项目

    新建.css和.less文件,并在HTML文件中引入.css

    在less文件中写入代码    运行后在css文件中会出现相应的代码

    @wght:bold;
    @col:red;
    @qx:oblique;
    @size:16px;
    @cen:center;
    @lin:300px;
    @bck:blue;
    @br:5px solid yellow;
    
    
    div {
        font-weight: @wght;
        font-style: @qx;
        color: @col;
        font-size: @size;
        text-align: @cen;
        line-height: @lin;
         @lin;
        height: @lin;
        background-color: @bck;
        border: @br;
    
    }
    

     第四步:编辑,运行(这是最重要的一步)

    完成以上配置后,直接在所用的HTML文件中集成终端 的提示符中写入以下代码。。。。。。

    lessc style.less style.css
    

    优点:less语言的优点:
    1、结构清晰,便于扩展
    2、可以方便地屏蔽浏览器私有语法差异
    3、可以轻松实现多重继承
    4、完全兼容 CSS 代码,可以方便地应用到老项目中

  • 相关阅读:
    java 算法最长连续递增子序列
    java 算法最长连续递增序列
    最大连续子数组和(Java)
    mysql时间序列与窗口函数
    CSS控制br高度
    小知识随手记(九):兄弟选择器(~和+)区别
    VUE组件递归实现自定义目录及拖拽效果
    VUE的插件解析
    VUE的mixin混入解析
    VUE高阶组件解析
  • 原文地址:https://www.cnblogs.com/bigbang66/p/13549902.html
Copyright © 2011-2022 走看看