文章目录[隐藏]
标签 可用于计数、提示或页面上其他的标记显示。使用 class .label 来显示标签
实例
Example Heading Label
Example Heading Label
Example Heading Label
Example Heading Label
Example Heading Label
Example Heading Label
<h1>Example Heading <span class="label label-default">Label</span></h1>
<h2>Example Heading <span class="label label-default">Label</span></h2>
<h3>Example Heading <span class="label label-default">Label</span></h3>
<h4>Example Heading <span class="label label-default">Label</span></h4>
<h5>Example Heading <span class="label label-default">Label</span></h1>
<h6>Example Heading <span class="label label-default">Label</span></h2>
<h1>Example Heading <span class="label label-default">Label</span></h1>
<h2>Example Heading <span class="label label-default">Label</span></h2>
<h3>Example Heading <span class="label label-default">Label</span></h3>
<h4>Example Heading <span class="label label-default">Label</span></h4>
<h5>Example Heading <span class="label label-default">Label</span></h1>
<h6>Example Heading <span class="label label-default">Label</span></h2>
可用的变体
用下面的任何一个类即可改变标签的外观。
Default Primary Success Info Warning Danger
<span class="label label-default">Default</span>
<span class="label label-primary">Primary</span>
<span class="label label-success">Success</span>
<span class="label label-info">Info</span>
<span class="label label-warning">Warning</span>
<span class="label label-danger">Danger</span>
如果标签数量很多怎么办？
如果你有大量的设置为 inline 属性的标签全部放在一个较窄的容器元素内，在页面上展示这些标签就会出现问题，每个标签就会有自己的一个 inline-block 元素（就像图标一样）。解决的办法是为每个标签都设置为 display: inline-block; 属性。关于这个问题以及实例，请参考：https://github.com/twbs/bootstrap/issues/13219