Less 的使用

时间：2021-06-11 06:03:07

Less 的使用

开发时直接使用

引用你的样式文件（main.less） (必须在less.min.js) 前引用
引用less.min.js 文件

<link href="resources/less/main.less" rel="stylesheet/less" type="text/css">
<script src="libs/less/less.min.js" type="text/javascript"></script>

打包成css

使用 node.js 安装 执行命令 npm install less
在node.js 环境下执行 lessc main.less (要转换的.less文件) main.css(要生成的.css文件)

语法

常用的特性

/*变量定义*/
@my-blue: #5B83AD;
#header { color: @my-blue; }

/*常用class定义*/
.fate-image{
    background-image: url(../login-background.jpg) !important;
    background-repeat: no-repeat;
}

.main-body{
    text-align: center;
    .fate-meng-image;
    background-size: cover;
    background-attachment: fixed;
}

参照该网站有大量介绍 http://www.bootcss.com/p/lesscss/

随机推荐

  1. October 19th Week 43rd Wednesday&comma; 2016

    I find that the harder I work, the more luck I seem to have. 越努力,越幸运. However, I find that the harde ...

  2. quartz与spring进行集成

    上一篇将了quartz框架的使用,spring同样也提供了对quartz的集成.这次就尝试一下在spring中集成quartz. 要在spring中使用job,Trigger和Scheduler,就要 ...

  3. Android中有时候运行程序的时候会报错：An internal error occurred during&colon;。。。。

    解决办法: Project -> Properties -> Run/Debug Settings: 1. select "Launching New_configuration ...

  4. javascript外部使用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. SpringMVC&lpar;三&rpar;：&commat;RequestMapping中的URL中设定通配符，可以使用&commat;PathVariable映射URL绑定的占位符

    1)带占位符的URL是Spring3.0新增的功能,该功能在SpringMVC向REST目标挺进发展过程中具有里程碑的意义. 2)通过@PathVariable可以将URL中占位符参数绑定到控制器处理 ...

  6. javascript的基础&lpar;2&rpar;--数据类型介绍

    1. number数据类型 所有的数字都是Number数据类型 利用typeof运算符可以返回当前数据的数据类型 特殊值:NaN not a number 不是一个数字 注意 :小数的计算可能产生丢失 ...

  7. Android 实现图片加水印

    加水印代码 public Bitmap addWaterMark(Bitmap src, String water, Context context){ Bitmap tarBitmap = src. ...

  8. &lbrack;LeetCode&rsqb; Generate Random Point in a Circle 生成圆中的随机点

    Given the radius and x-y positions of the center of a circle, write a function randPoint which gener ...

  9. 计数排序与桶排序python实现

    计数排序与桶排序python实现 计数排序 计数排序原理: 找到给定序列的最小值与最大值 创建一个长度为最大值-最小值+1的数组,初始化都为0 然后遍历原序列,并为数组中索引为当前值-最小值的值+1 ...

  10. （二 -2） 天猫精灵接入Home Assistant-自动发现Mqtt设备

    参考中文教程:  https://www.hachina.io/docs/7230.html 英文官网 两个温度传感器:https://www.home-assistant.io/docs/mqtt/ ...

相关文章