【自动隐藏】

　　当没有内容的时候，自动隐藏

.label:empty {
    display: none;
}

Example heading 

【颜色设置】

　　和按钮元素button类似，label样式也提供了多种颜色：

　　☑ label-default:默认标签，深灰色

　　☑ label-primary：主要标签，深蓝色

　　☑ label-success：成功标签，绿色

　　☑ label-info：信息标签，浅蓝色

　　☑ label-warning：警告标签，橙色

　　☑ label-danger：错误标签，红色

　　主要是通过这几个类名来修改背景颜色和文本颜色

Default
Primary
Success
Info
Warning
Danger

【自动隐藏】

　　如果没有新的或未读的信息条目，也就是说不包含任何内容，徽章组件能够自动隐藏（通过CSS的 :empty 选择符实现)

.badge:empty {
    display: none;
}

Inbox 

【按钮徽章】

　　徽章在按钮元素button和胶囊形导航nav-pills也有类似的样式，只不过颜色不同

  
Home 42
  
Profile
  
Messages 3


  Messages 4

巨幕

　　这是一个轻量、灵活的组件，它能延伸至整个浏览器视口来展示网站上的关键内容

  
小火柴的蓝色理想
  
好的代码像粥一样，都是用时间熬出来的
  
Learn more

如果为巨幕组件添加圆角，把此组件放在 .container 元素的里面即可

    

        
小火柴的蓝色理想
        
好的代码像粥一样，都是用时间熬出来的
        
Learn more
    

页头

　　页头组件能够为 h1 标签增加适当的空间，并且与页面的其他部分形成一定的分隔。它支持 h1 标签内内嵌 small 元素的默认效果，还支持大部分其他组件（需要增加一些额外的样式）

.page-header {
    padding-bottom: 9px;
    margin: 40px 0 20px;
    border-bottom: 1px solid #eee;
}

  
Example page header Subtext for header

更多编程相关知识，请访问：编程视频！！

以上就是详解Bootstrap中的标签、徽章、巨幕和页头的详细内容，更多请关注其它相关文章！