响应式栅格Bootstrap结构Bootstrap入门之四.PPTVIP

bootstrap总体架构图，先说明bootstrap包括以上的内容 其中12栅格系统是核心功能，也是响应式设计核心理念的实现形式 布局组件可用在页面的任意元素上 jquery是js框架的基础 响应式是个设计理念，所有bootstrap内容都是以响应式为设计理念来实现的 与上面的两页一起演示【02 12栅格系统的使用】案例 可以介绍下原理：col-md-12{width：100%；}col-md-11{width：91.6666666666%；}以此类推 演示【03 列偏移】案例 演示【04 列嵌套】案例 演示【05 列排序】案例 可以说点关于原理的东西，使用的是媒体查询media来实现 演示【06 跨设备组合定义】案例 原因是没有清楚浮动，演示【07 清除浮动】案例 上面的案例一直是使用中等屏幕来演示的，其他的屏幕只是需要改变前面的缩略符就可以了 Bootstrap框架 ——Bootstrap 入门 课前考试 教员备课时根据班级情况在此添加考试内容 时间：10分钟内 要求：保证所有学员都能参与 形式：选择、问答、小机试均可 内容：涉及复习和预习的内容 * 技能目标 目录结构 了解bootstrap概念 掌握bootstrap的特性 掌握bootstrap下载文件的使用 掌握bootstrap的结构 Bootstrap简介 Bootstrap概念 Bootstrap入门 之一 B