1.Alert警告提示框
将任意文本和一个可选的关闭按钮组合在一起就能组成一个警告框。
常用提示框样式：
成功提示
消息提示
警告提示
危险提示
除此之外，还有如四种：
.alert-primary .alert-secondary .alert-light .alert-dark
每种提示框都是通过“.alert”类（必须设置）和一个特定意义的类（如 .alert-info）来实现的。
“role”属性通常用于增强语义，对一些非标准的组件进行用途描述，便于其他辅助工具更好地判别当前元素的实际作用。
另外，还可以添加标题“alert”，如：
…
2.可关闭的提示框
如要为提示框添加关闭按钮，则需要添加一个“.alert-dismissible”类，
同时，关闭按钮设置“ data-dismiss="alert" ”属性。
× Warning! Better check yourself, you're not looking too good.
说明事项：
属性“ aria-* ”主要用于辅助工具（如屏幕阅读器）识别当前内容，便于其判断是否将当前内容输出视觉效果或声音效果。
aria-hidden="true" 属性，表示当前元素内容不需要屏幕识读设备抓取，忽略跳过处理
aria-label="Close"属性，表示对当前
aria-label="Close"扩展：正常情况下，form表单的input组件都有对应的label，当input获取到焦点时，
屏幕阅读器会读出对应label里的文本。但是如果没有给输入框设置label，
当其获得焦点时，屏幕阅读器会读出aria-label属性的值，aria-label不会在视觉上呈现效果。
除此之外，
也可以将关闭按钮封装为JavaScript触发器进行调用，
通过“$().alert();”等方法触发提示框关闭，该方法用于侦听具有“ data-dismiss="alert" ”属性的敲击事件。
示例：$(".alert").alert("close");
3.警告框中的链接
通过给“.alert”元素包裹之中的链接（标签）定义“.alert-link”类，具有突出显示匹配颜色链接。
示例：
消息提示，点击查看
4.Badge徽章
可以理解为用于突出显示元素内容的文本样式。
要设置元素的徽章样式，类似 Alert样式需要定义“.badge”和“.badge-* ”至少两个类名。
① 基本样式：
Example heading New
Example heading New
Example heading New
Example heading New
Example heading New
Example heading New
还有“badge-dark、badge-light”等。
② 按钮或链接中添加徽章
将设置有“.badge”类的标签包裹在
class="sr-only"，用于为屏幕阅读器（screen reader）添加描述文本，且不会显示给正常使用者。
③ 药丸徽章
在基本样式的基础上增加“badge-pill”（修饰类）样式。示例如下：
Danger
④ 徽章链接
给标签赋予“.badge”类，使得超链接拥有徽章样式。示例如下：
<a href="#" class="badge badge-success">Successa>
5.Breadcrumb面包屑（导航）
主要用于创建有层次结构的位置信息，如菜单、目录、索引等，在用户界面实现导航辅助。
实现面包屑的三个主要类：
breadcrumb，定义面包屑的区域
breadcrumb-item，定义面包屑的内容项
active，定义活动页（当前页）
注意：对于非活动页通常需要嵌套标签进行跳转链接。
构建面包屑导航的常用方式是使用“无序列表”，示例如下：
也可以不使用无序列表的方式，示例如下：
Home
Library
Data
Bootstrap
其他说明：
标签用于定义导航连接，作为标注一个导航连接的区域（不是必须使用）。
还可以在
中添加屏幕属性，用于规定导航是否显示，以适应不同设备屏幕需求。6.Button按钮
BootStrap通过“.btn”类和其他“.btn-*”特定意义的类定义了很多按钮样式
① 基本样式
（链接样式的按钮）
② ".btn"类还可以应用在和标签上，示例如下：
③ 轮廓按钮
与基本样式不同的是，没有内部背景颜色，而是突出了按钮轮廓和字体样式
类名的差异也是在特定类的名称中加入了“outline”，示例如下：
④ 按钮大小
“.btn-lg”（大尺寸按钮）、“.btn-sm”（小尺寸按钮）、“.btn-block”（全部宽度按钮），示例如下：
⑤ 活动状态和禁用状态
“.active”，表示活动状态，用于突出显示按钮被按下时的样式
“.disable”，表示禁用状态，按钮无法点击
Link
<button type="button" class="btn btn-secondary btn-lg" disabled>Button
Link
说明事项：
“.disable”类与html中
所以对于
但是对于标签不支持“disable”属性，因此只能使用“.disable”类的方式。
“tabindex”扩展：
用于设置键盘中的TAB键在控件中的移动顺序，即焦点的顺序。
把控件的tabIndex属性设成1到32767某个值，就可以将其加入TAB键的序列中。
使用TAB键在网页中切换时，焦点将按照tabIndex的属性值从小到大的顺序移动。
默认的tabIndex属性值为 0 ，将排列在所有指定tabIndex的控件之后。
若tabIndex属性为负值（如tabIndex="-1"），那么将被排除在TAB键的序列之外。
如果两个控件的tabIndex属性相同，则以控件在html代码中出现的顺序为准。
如果tabIndex属性值使用-1时，onfocus与onblur事件仍会被启动。
⑥ 复选框按钮和单选按钮
针对标签的“checkbox”和“radio”两个属性的按钮样式。
input type=“checkbox”时，示例：
<div class="btn-group-toggle" data-toggle="buttons">
Checked
input type=“radio”时，示例：
<div class="btn-group btn-group-toggle" data-toggle="buttons">
Active
Radio
Radio
注意：两种样式都是通过将
然后给外层容器赋予 class类和 data-toggle属性，实现 input按钮（组）的转换。
⑦ 按钮组
多个按钮包裹在一个容器中，形成按钮拼接摆放的效果。
普通按钮组（Button group），示例：
LeftMiddleRight
按钮工具栏（Button toolbar），多个按钮组封装在一个容器中，示例：
<div class="btn-toolbar role="toolbar" aria-label="Toolbar with button groups">
嵌套按钮组（Nesting），将一个按钮组包裹在另一个按钮组内部，示例：
垂直按钮组，
为按钮组的外部容器添加“.btn-group-vertical”类，则按钮组将垂直方向排列。
语法示例：
...
按钮组大小，
按钮组中的按钮大小不需要针对具体某一个进行设置，只需要对按钮组容器设置即可，
包括多个按钮组嵌套。
示例：
...
...
...
