框架简介
Less
Less是一种CSS预处理技术，它是一种动态样式语言。它使用类似CSS的语法，为CSS赋予了动态语言的特性，如变量、继承、运算、函数等，更方便CSS的编写和维护。它可以在多种语言环境中使用，包括浏览器、桌面客户端、服务端。详情访问：http://www.lesscss.net
下载
Bootstrap框架的文件和源码可以在网站（http://www.bootcss.com/）下载
从该链接下载的内容是编译后可以直接使用的文件。默认情况下，下载后的文件分为两种：一种是未经压缩的文件bootstrap.css，一种是经过压缩处理的文件bootstrap.min.css。一般网站正式运行的时候，使用压缩过的min文件，以节约网站传输流量。而我们开发调试的时候往往使用原始的、未经压缩的文件，以便进行debug跟踪。
编译版解压后，可以看到如下结构的文件夹和文件。这些文件按照类别放到了不同的文件夹内，并提供了未压缩与压缩两种版本。
fonts目录下的文件用于icon图标展示，我们称这种方式为@font-face版本的icon实现，该字体来自glyphicons.com网站。所谓@font-face，其实是通过CSS里的@font-face语法，将安全的Web字体(Web Font)即时下载到客户端，从而进行引用显示。通过这种技术显示图标的好处是，图标可以被任意缩放、改变颜色，你需要做的只是像修改文字样式那样修改图标样式即可。
bootstrap.min.css和bootstrap.min.js是压缩后的文件，用于生产环境使用，而普通的bootstrap.css和bootstrap.js是用于开发环境进行调试、分析的。
可以根据自己的程序结构，对上述的css、js文件夹名称进行随意重命名，但是不能对fonts文件夹进行重命名，因为css文件里的源码使用了相对路径（../fonts/），如果重命名了，那就取不到这些字体文件了。
注意：
Bootstrap所有的JavaScript插件都依赖于jQuery库，要确保在使用这些功能的时候引用相应的jQuery文件。
标准模板
如下代码是使用Bootstrap框架的最基本HTML代码,可以在此基础上进行自己的扩展，只需要确保文件引用顺序一致即可。
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ --> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <h1>你好，世界！</h1> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>
上述代码中：
<meta name="viewport" content="width=device-width, initial-scale=1">
这个表示Bootstrap从3.0版开始全面支持移动平台，并将贯彻移动先行的宗旨。上述代码的意思是，默认情况下，UI布局的宽度和移动设备的宽度一致，缩放大小为原始大小。对于移动代码的处理，还有另外一种形式，代码如下：
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
上述代码表示：强制让文档的宽度与设备的宽度保持1:1，文档最大的宽度比例是1，且不允许用户单击屏幕放大浏览。一定要注意的是，content里的多个属性的设置一定要用分号和空格来隔开，如果不规范将不起作用。
viewport是针对移动端浏览器写的一些页面属性，name="viewport" --这就是针对移动端浏览器，width=device-width--告诉浏览器页面的宽度应该等于设备的宽度，initial-scale=1.0---页面将是原本尺寸展示，如果后面是2.0的话，就是将页面放大两倍，maximum-scale=1.0,---最大放大至原先大少，----user-scalable=0" 是禁止缩放！
