Bootstrap
一、Bootstrap简介
1. Bootstrap是什么?
Bootstrap是Twitter推出的一个开源的前端开发框架
基于HTML、CSS、JavaScript,代码简洁、视觉优美,用来快速开发基于PC及移动端的Web页面,更迅速、简单
Bootstrap官网:http://getbootstrap.com/
中文网:http://www.bootcss.com/
版本:v3.0、v4.0
2. 特点
- 跨设备、跨浏览器
兼容所有主流浏览器,包括IE7、IE8等
- 响应式布局
支持PC端、移动端(手机、PAD),移动设备优先
- 丰富的组件
表单、下拉菜单、导航、标签、徽章、面板等
- 内置jQuery插件
模态框、工具提示、弹出框、轮播图等
- 支持动态样式
LESS、SASS,可以使用变量、嵌套、混合等,编写样式更快、更灵活
二、起步
1. 下载
CDN:Content Delivery Network,内容分发网络,提供稳定、快速的资源访问服务。
**Bootstrap依赖于jQuery库**
2. 基本模板
HTML5文档类型
移动设备优先
基本的全局样式
font-size: 14px; line-height: 20px; color: #333; a{color: #337ab7; text-decoration: none;} a:hover{color: #23527c;text-decoration: underline;}
布局容器
.container类 固定宽度,支持响应式布局的容器
.container-fluid类 100%宽度,占据整个窗口的容器