Bootstrap使用

官方文档：https://v3.bootcss.com/
菜鸟教程：https://www.runoob.com/bootstrap/bootstrap-tutorial.html

一.基础用法

• 基本样式

  • 排版(标题、页面主体、内联文本元素……)
  • 代码(<code>、<pre>……)
  • 表格(基本、条纹状、带边框、鼠标悬停……)
  • 表单、按钮、图片、辅助类、响应式实用工具……

• 布局组件

  • 下拉菜单、按钮组、导航元素、导航栏、分页、缩略图、进度条、多媒体对象、列表组……

• 基本样式和布局组件用法：引入文件 –> 加标签/加class

二.响应式布局

• 随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。行必须放置在 .container class 内，以便获得适当的对齐（alignment）和内边距（padding）。使用行来创建列的水平组。内容应该放置在列内，且唯有列可以是行的直接子元素。
• 下面的五个列分类分别对应：小于576px/大于等于576px/大于等于768px/大于等于992px/大于等于1200px。例：.col-lg-10意思是当屏幕/视口大于等于992px时，这个容器在12份里占10份。

.container

三.JS插件

• 插件的作用是实现组件交互。有模态框、下拉菜单、滚动监听、提示工具、弹出框、折叠……
• 用法：通过data-*属性/通过js API

<!--例：下拉菜单-->

//通过javascript使用