响应式布局2.Bootstrap前端开发框架

1.1 介绍

Bootstrap来自Twitter,是目前最受欢迎的前端框架。Bootstrap是基于HTML、CSS和Javascript的，它简洁灵活，使得web开发更加快捷。

• 中文官网：http://www.bootcss.com/


• 官网：http://getbootstrap.com/


• 推荐使用：https://v3.bootcss.com/

1.2 使用

控制权在框架本身，使用者要按照框架所规定的某种规范进行开发

Bootstrap使用四部曲：

1.2.1 创建文件夹结构

在https://v3.bootcss.com/下载bootstrap的压缩文件，解压后将其中的文件夹(css,fonts,js)复制到刚刚建立的bootstrap文件夹下：

1.2.2 创建html骨架结构、引入相关样式文件

1.2.3 书写内容

• 直接拿Bootstrap预先定义好的样式来用


• 修改Bootstrap原来的样式，注意权重问题


• 学好Bootstrap的关键在于知道它定义了哪些样式，以及这些样式能实现什么样的效果


（成功）Success



/* 利用我们自己写的样式覆盖原先的样式 */
.login {
width: 88px;
height: 45px;
}

1.3 布局容器

Bootstrap需要为页面内容和栅格系统包裹一个.container容器，Bootstrap预先定义好了这个类，叫.container,它提供两个做此用处的类。（注意：这个类名必须是container，不可更改）