bootstrap的相关知识点

先上思维导图吧

---

目录

1.bootstrap简介

2.bootstrap注意事项

3.全局样式

---

1.bootstrap简介

 bootstrap：栅格布局，提供响应式布局（也就是内容会随着窗口大小的改变进行改变）

2.bootstrap注意事项

 1.bootstrap 提供 js font css 文件

        这三个文件一定要考入到项目当中，而且要保证三个文件平级存放。

2.使用css文件

        1.只需要在html 中将bootstrap.min.css引用进入就可以了。

                如果在项目中不导入font可能会影响css的样式效果。

  3.bootstrap的插件是基于jquery做的，所以要使用bootstrap的js插件必须要进入jQuery组件

3.全局样式

1.container

        使用在div上，并且根据浏览器的大小进行适合的留白，适用于网页正文

2.container-fluid

        使用在div上，不管浏览器大小直接占满全行，经常使用在top,bottom处

3.栅格系统

        1.行内的div宽度不是用像素设定，而是占几个格子

        2.注意事项

                1.使用栅格布局最外层必须用container包裹

                2.如果class有很多单位，它是以该单位适应的窗口为准则选择单位的，而不是以顺序或者别的。

4.组件,js组件

        1.动态效果

                需要导入bootstrap.js组件，还要在这之前导入jquery.js组件

       

        

代码：