Bootstrap知识
- Bootatrap介绍：
- Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的
- 移动设备优先：自 Bootstrap 3 起，框架包含了贯穿于整个库的移动设备优先的样式。
浏览器支持：所有的主流浏览器都支持 Bootstrap。
Internet Explorer Firefox Opera Google Chrome Safari
- Bootstrap包含的e:css , 组件，js插件。
- 安装：
http://getbootstrap.com/
- 当您下载了 Bootstrap 的已编译的版本，解压缩 ZIP 文件，您将看到下面的文件/目录结构
- Bootstrap 源代码
Bootstrap 模板
//width 属性控制设备的宽度。假设您的网站将被带有不同屏幕分辨率的设备浏览，那么将它设置为 device-width 可以确保它能正确呈现在不同设备上。
initial-scale=1.0 确保网页加载时，以 1:1 的比例呈现，不会有任何的缩放。
在移动设备浏览器上，通过 user-scalable=no 可以禁用其缩放（zooming）功能。
通常情况下，maximum-scale=1.0 与 user-scalable=no 一起使用。这样禁用缩放功能后，用户只能滚动屏幕，就能让您的网站看上去更像原生应用的感觉。
//css样式
Hello, world!
国内推荐使用 Staticfile CDN 上的库：
- 响应式图片
- 容器
...
- 网格系统
.row 和 .col-xs-或 .col-xs-4 或col-md-4 或col-lg-4 总和是12 col-md-offset-3偏移
- 媒体查询
/* 超小设备（手机，小于 768px） */
/* Bootstrap 中默认情况下没有媒体查询 */
/* 小型设备（平板电脑，768px 起） */
@media (min-width: @screen-sm-min and (max-width: @screen-sm-max)) { ... }
/* 中型设备（台式电脑，992px 起） */
@media (min-width: @screen-md-min and (max-width: @screen-md-max)) { ... }
/* 大型设备（大台式电脑，1200px 起） */
@media (min-width: @screen-lg-min) { ... }
- Bootstrap表格
为表格添加基础样式。
表格标题行的容器元素（），用来标识表格列。
表格主体中的表格行的容器元素（）。
一组出现在单行上的表格单元格的容器元素（| 或 | ）。
| 默认的表格单元格。
| 特殊的表格单元格，用来标识列或行（取决于范围和位置）。必须在 内使用。
关于表格存储内容的描述或总结。
表格类
.table 为任意 添加基本样式 (只有横向分隔线) 尝试一下
.table-striped 在 内添加斑马线形式的条纹 ( IE8 不支持) 尝试一下
.table-bordered 为所有表格的单元格添加边框 尝试一下
.table-hover 在 内的任一行启用鼠标悬停状态 尝试一下
.table-condensed 让表格更加紧凑
- Bootstrap表单
form
|
