Bootstrap中的辅助类是什么
这篇文章将为大家详细讲解有关Bootstrap中的辅助类是什么，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。
创新互联于2013年开始，先为和县等服务建站，和县等地企业，进行企业商务咨询服务。为和县企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。
Bootstrap提供了一组工具类，用于辅助项目的开发。本篇文章给大家详细介绍一下Bootstrap中的辅助类。
文本色
通过颜色来展示意图，Bootstrap 提供了一组工具类。这些类可以应用于链接，并且在鼠标经过时颜色可以还可以加深，就像默认的链接一样
.text-muted：提示，使用浅灰色（#777）
.text-primary：主要，使用蓝色（#337ab7）
.text-success：成功，使用浅绿色(#3c763d)
.text-info：通知信息，使用浅蓝色（#31708f）
.text-warning：警告，使用黄色（#8a6d3b）
.text-danger：危险，使用褐色（#a94442）
Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.
Nullam id dolor id nibh ultricies vehicula ut id elit.
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Maecenas sed diam eget risus varius blandit sit amet non magna.
Etiam porta sem malesuada magna mollis euismod.
Donec ullamcorper nulla non metus auctor fringilla.
背景色
和情境文本颜色类一样，使用任意情境背景色类就可以设置元素的背景。链接组件在鼠标经过时颜色会加深，就像上面所讲的情境文本颜色类一样
.bg-primary：主要，使用蓝色（#337ab7）
.bg-success：成功，使用浅绿色(#dff0d8)
.bg-info：通知信息，使用浅蓝色（#d9edf7）
.bg-warning：警告，使用浅黄色（#fcf8e3）
.bg-danger：危险，使用浅紫色（#f2dede）
Nullam id dolor id nibh ultricies vehicula ut id elit.
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Maecenas sed diam eget risus varius blandit sit amet non magna.
Etiam porta sem malesuada magna mollis euismod.
Donec ullamcorper nulla non metus auctor fringilla.
文本对齐
通过文本对齐类，可以简单方便的将文字重新对齐
.text-left {
text-align: left;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.text-justify {
text-align: justify;
}
.text-nowrap {
white-space: nowrap;
}Left aligned text.
Center aligned text.
Right aligned text.
Justified text.
No wrap text.
【居中】
为任意元素设置 display: block 属性并通过 margin 属性让其中的内容居中
center
大小写
通过这几个类可以改变文本的大小写
.text-lowercase {
text-transform: lowercase;
}
.text-uppercase {
text-transform: uppercase;
}
.text-capitalize {
text-transform: capitalize;
}Lowercased text.
Uppercased text.
Capitalized text.
按钮和符号
【关闭按钮】
通过使用一个象征关闭的图标，可以让模态框和警告框消失
×
【三角符号】
通过使用三角符号可以指示某个元素具有下拉菜单的功能
.caret {
display: inline-block;
width: 0;
height: 0;
margin-left: 2px;
vertical-align: middle;
border-top: 4px dashed;
border-top: 4px solid \9;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}
浮动
通过添加一个类，可以将任意元素向左或向右浮动。!important 被用来明确 CSS 样式的优先级
[注意]排列导航条中的组件时可以使用.navbar-left 或 .navbar-right
【清除浮动】
通过为父元素添加 .clearfix 类可以很容易地清除浮动（float）
.pull-left {
float: left !important;
}
.pull-right {
float: right !important;
}.clearfix() {
&:before,
&:after {
content: " ";
display: table;
}
&:after {
clear: both;
}
}
left
