标签
标签组件通常用来做一些高亮显示用以提醒。使用“.label”样式来实现，可以使用span这样的行内标签，例如：标签 实现源码如下：
rush:css;">
.label {
display: inline;
padding: .2em .6em .3em;
font-size: 75%;
font-weight: bold;
line-height: 1;
color: #fff;
text-align: center;
white-space: Nowrap;
vertical-align: baseline;
border-radius: .25em;
}
rush:css;">
a.label:hover,a.label:focus {
color: #fff;
text-decoration: none;
cursor: pointer;
}
rush:css;">
.label:empty {
display: none;
}
可以追加颜色样式，类名如下： .label-deafult:默认标签，深灰色 .label-primary：主要标签，深蓝色 .label-success：成功标签，绿色 .label-info：信息标签，浅蓝色 .label-warning：警告标签，橙色 .label-danger：错误标签，红色
实现代码如下：
rush:css;">
.label-default {
background-color: #777;
}
.label-default[href]:hover,.label-default[href]:focus {
background-color: #5e5e5e;
}
.label-primary {
background-color: #428bca;
}
.label-primary[href]:hover,.label-primary[href]:focus {
background-color: #3071a9;
}
.label-success {
background-color: #5cb85c;
}
.label-success[href]:hover,.label-success[href]:focus {
background-color: #449d44;
}
.label-info {
background-color: #5bc0de;
}
.label-info[href]:hover,.label-info[href]:focus {
background-color: #31b0d5;
}
.label-warning {
background-color: #f0ad4e;
}
.label-warning[href]:hover,.label-warning[href]:focus {
background-color: #ec971f;
}
.label-danger {
background-color: #d9534f;
}
.label-danger[href]:hover,.label-danger[href]:focus {
background-color: #c9302c;
}
徽章
徽章效果也是用来做一些提示信息使用，比如显示有几条未读消息。使用“.badge”样式来实现。可以使用span标签来制作，例如： 实现源码如下：
rush:css;">
.badge {
display: inline-block;
min-width: 10px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
line-height: 1;
color: #fff;
text-align: center;
white-space: Nowrap;
vertical-align: baseline;
background-color: #777;
border-radius: 10px;
}
当没有内容的时候隐藏，实现源码如下：
.badge:empty { display: none; }
徽章可以与按钮或者导航之类配合使用，实现源码如下：
.badge,.nav-pills > .active > a > .badge {
color: #428bca;
background-color: #fff;
}
.nav-pills > li > a > .badge {
margin-left: 3px;
}
缩略图
简单缩略图
通过“thumbnail”样式配合bootstrap的网格系统来实现。例如：
rush:xhtml;">
...
