Bootstrap
1.概念:一个前端开发的框架,Bootstrap来自Twitter,目前受欢迎的前端框架,
是基于HTML, CSS, JavaScript,它简单灵活,是的web开发更加快捷
框架:一个半成品软件,开发人员可以在框架基础上,进行二次开发,简化编码
好处:
1.定义了很多的css样式和js插件。我们开发人员可以使用这些样式和插件得到丰富的页面效果
2.响应式布局
同一套页面可以兼容不同分辨率的设备
2.Bootstrap使用:
1.下载Bootstrap
2.在项目中导入js, font, css文件夹
3.创建html页面,引入必要的资源文件
响应式布局
作用:同一套页面可以兼容不同分辨率的设备
实现:依赖于栅格系统:将一行平均分成12个格子,指定元素占几个格子
步骤:
1.定义容器。相当于table
容器分类:
1.container:固定宽度,每一类设备上两边都有适当留白
2.container-fluid:每一类设备100%宽度
2.定义行。相当于之前的tr 样式row
3.定义元素。 指定该元素在不同的设备上,所占的格子数目 样式:col-设备代号-单个元素占的格子数目
设备代号:
1.xs:超小屏幕 手机(<768px):col-xs-12
2.sm:小屏幕 平板(>=768px):
3.md:中等屏幕 桌面显示器(>