辅助类

2017-03-01  本文已影响0人  ErikYu

情境文本颜色

<p class='text-muted'>...</p>
<p class='text-primary'>...</p>
<p class='text-success'>...</p>
<p class='text-info'>...</p>
<p class='text-warning'>...</p>
<p class='text-danger'>...</p>

情境背景色

<p class="bg-primary">...</p>
<p class="bg-success">...</p>
<p class="bg-info">...</p>
<p class="bg-warning">...</p>
<p class="bg-danger">...</p>

关闭按钮

通过使用一个象征关闭的图标,可以让模态框和警告框消失

<button class='close' aria-label='Close' type='button' >
  <span aria-hidden='true'>×</span>
</button>

三角符号

指示某个元素具有下拉菜单功能

<span class='caret'></span>

快速浮动

.pull-left.pull-right

清除浮动

mixin

.clearfix() {
  &:before,
  &:after{
    content: " ";
    display: table;
    clear: both;
  }
}
/*use as a mixin*/
elem{
  .clearfix();
}

显示或隐藏内容

.show.hidden强制对任意块级元素显示或隐藏,使用!important,.invisible只改变元素的可见性

上一篇 下一篇

猜你喜欢

热点阅读