Less 的使用

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/