一、简介

概述
该框架是由Twitter公司（全球最大的微博）两个工程师研发的，基于html、css、javascript的开源框架。
用途
重要部分就是响应式布局，丰富多样的样式定义、组件和插件
二、环境安装
下载
Sass和Less 是升级版的CSS

我使用的bootstrap代码是经过编译过的代码。
框架结构
标准模板
1)

让浏览器以最新的IE内核版本或使用谷歌内核去渲染当前页面，是先当前项目开发必备meta属性
2)

视口meta 标签，让文档的宽度和设备的宽度一致，默认缩放比为1，这个是让手机端浏览器有响应式作用
3) 由于那些html5.0的标签及媒体查询属性，不能被IE8及以下版本IE浏览器识别，所以可以引入html5shiv.min.js和respond.js

4) 注释在不同浏览器版本下引入对应js：
lt ie9 小于ie9
lte ie8 小于等于ie8
CDN（掌握）
内容分发网络，传统静态资源的问题
l 站点安全得到有效保障
l 用户集中访问时，会减轻服务器压力
l 内集中放置，方便管理。
三、排版
四、表格

四、按钮
三种可以作为按钮使用的标签:input a button
按钮的预定义样式
按钮的尺寸
激活状态和禁用状态

五、表单
表单的基本类型
text、password、radio、checkbox
html5.0 属性： tel、number、search等：
表单的基本格式
第一、二步的样式可以省略，第三步form-conctrol不能少
内联表单

form-inline 在大屏幕表单按inline-block并排放置，当屏幕小于768px，会恢复独占行的样式
表单合组
复选框和单选框

设置不可点击的禁用状态
文本域和下拉列表
调整尺寸

六、图片

七、网格
什么是响应式布局？
传统的：
流式布局：普通的浮动布局
自适应：百分比
响应式：
二者结合，使用@media 做屏幕适配
网格系统的响应式原理
bootstrap的布局使用
bs框架包含了一个响应时候，移动设备优先，不固定的网格系统，可以随着设备或视口的大小增加宽度，一行最显示12列。

ITPub博客

bootstrap简介、环境安装、排版、表格、按钮、表单、图片、网格

最新文章