bootstrap里面说的variables.less在哪儿

variables.less 属于Bootstrap 的 Less 组件之一

位于 'lib' 目录下。自 Bootstrap v1.4.0 版本起，就包含有九个 less 文件。下面我们一起来看看这九个神拆文件分别包含什么。

bootstrap.less

这是主要的 Less 文件。该文件中导入了一些其他的 less 文件。该文件中没有任何代码。

forms.less

这个 Less 文件包含了表单布局、输入框类型的样式。

mixins.less

这个 Less 文件让 CSS 代码可重复使用。

patterns.less

这个 Less 文件包含了重复的用户界镇源面元素的 CSS 代码，不会被位于 scaffolding Less 文件中的基本样式覆盖。

reset.less

这个 Less 文件包含了 CSS 重置。这是 Eric Meyer 的 CSS 重置的一个更新。一些 HTML 元素比如 dfn、samp 等的重置被免除。

scaffolding.less

这个 Less 文件保存了创建网格系统、结构化布局、页面模板所需的基本样式。

tables.less

这个 Less 文件包含了创建表格的样式。

type.less

这个 Less 文件下可找到排版相关的样式。标题、段落、列表、代码等的样式位于这个文件里边。

variables.less

这个 Less 文件包含了要定制 Bootstrap 外观和感观的变量。

如何使用

如果要使用它，请在您的 HTML 页面包含下面代码：

<link rel="stylesheet/less" href="lib/bootstrap.less" media="all" />

<script src="js/less-1.1.5.min.js"></script>

请注意，less-1.1.5.min.js 不在 js 文件夹御瞎态内，您需要下载并把它放置在指定的文件夹下。

LESS ：一种动态样式语言。

LESS 将 CSS 赋予了动态语言的特性，如 变量， 继承， 运算， 函数. LESS 既可以在 客户端 上运行 (支持IE 6+, Webkit, Firefox)，也可以借助Node.js或者Rhino在服务端运行。

在介绍如何通过 lessc （less源码编译器）把编写好的.less文件生成.css文件之前，非常有必要了解一下Node.JS。

一、初识Node.js

Node.js不是JS应用、而是JS运行平台，负责执行服务器端的Javascript代码。事实上，Node.js采用C++语言编写而成，是一个衡巧Javascript的运行环境。

Node.js采用了Google Chrome浏览器的V8引擎，性能很好，同时还提供了很多系统级的API，如文件 *** 作、网络编程等。

要想了解更多Node.JS，请参考《深入浅出Node.js》前两篇文章即可

1）.深入浅出Node.js（一）：什么是Node.js

2）.深入浅出Node.js（二）：Node.js&NPM的安装与配置（PS：安装最新版本的Node.JS已默认自带了NPM，无需通过GitHub去安装）

我本机的Node.JS默认安装在D:\nodejs\目录下，如图

启动node.js，查看版本

二、安装LESS包

通过npm install -d less命令安装LESS包。

为咐和键了将less包安装在nodejs的node_modules目录下，可以先进入d:盘，然后使用该命令

LESS包安装完成后，进入D:\nodejs\node_modules\，该目录下有三个目录，分别为less，npm和.bin（该目录下有lessc编译器），把D:\nodejs\node_modules\.bin添加到环境变量中。

三、编写.less文件并编译它

这是一个简单的测试代码test.less，内容如下

复制代码

@color: #4D926F

#header {

color: @color

}

h2 {

color: @color

}

复制代码

该文件位于 E:\Code\VS2013\BootstrapDemo\LessDemo\Less\test.less。

启动node.js控制台，进入test.less文件所在的目录，输入lessc test.less >test.css命令，less文件就会被编棚郑译成css文件

打开生成的test.css 文件

---