**BOOTSTRAP** Bootstrap简介
>简介
>>快速开发web应用程序和网站的前端框架，包括基本框架、css、bootstrap布局组件、插件
>>特点
开源、功能强大的内置组件，易于定制。
为开发人员穿件接口提供了一个简介统一的解决方案
响应式设计，响应式css能够自适应于台式机、平板电脑和手机。
每次使用调用jquery.js bootstrape.min.css bootstrape.min.js
>bootstrap css 概览
>>因为使用了H5元素和css属性，需要使用H5文档类型DOCTYPE
在文档的开头声明<!DOCTYPE html>
>>移动设备优先
在头部添加一下代码
<meta name = "viewport" content - "width=device-width, initial-scale=1.0">
width = device-width属性控制设备的宽度。设置成device-width可以确保他能正确的呈现在不同的设备上
initial-scale=1.0确保网页加载时，以1:1的比例呈现，不会有任何缩放。
user-scalable = no 设置viewport meta可以禁用其他缩放功能。
maxium-scale = 1.0最大缩放比例为1倍
>>响应式图像
<img src = "..." class = "img-responsice" alt = "响应式图像">
img-responsive class可以图像对响应式布局更友好的支持
<span style="font-size:14px;">.img-responsive {
display: inline-block;
height: auto;
max-width: 100%;
}</span>标签选择器，直接对body进行设计
<span style="font-size:14px;">body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.428571429;
color: #333333;
background-color: #ffffff;
}</span>@font-family-base @font-size-base @line-height-base
>>链接样式
@line-color设置全局的颜色
<span style="font-size:14px;">a:hover,
a:focus {
color: #2a6496;
text-decoration: underline;
}
a:focus {
outline: thin dotted #333;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}</span>>>容器（container）
<div class = "container">
...
<div>
<span style="font-size:14px;">.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}</span><span style="font-size:14px;">.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}</span>