標簽、徽章、超大屏幕北京電子科技職業學院標簽一徽章二目錄Contents超大屏幕三標簽1標簽標簽可用于計數、提示或頁面上其他的標記顯示。使用class.label來顯示標簽。實例代碼如下：<h1>ExampleHeading<spanclass="labellabel-default">Label</span></h1><h2>ExampleHeading<spanclass="labellabel-default">Label</span></h2><h3>ExampleHeading<spanclass="labellabel-default">Label</span></h3><h4>ExampleHeading<spanclass="labellabel-default">Label</span></h4>標簽以上實例代碼運行后結果是：可以使用修飾的classlabel-default、label-primary、label-success、label-info、label-warning、label-danger來改變標簽的外觀。標簽運用修飾符的標簽：<spanclass="labellabel-default">默認標簽</span><spanclass="labellabel-primary">主要標簽</span><spanclass="labellabel-success">成功標簽</span><spanclass="labellabel-info">信息標簽</span><spanclass="labellabel-warning">警告標簽</span><spanclass="labellabel-danger">危險標簽</span>以上實例代碼運行后結果是：徽章2徽章徽章與標簽相似，主要的區別在于徽章的邊角更加圓滑?；照拢˙adges）主要用于突出顯示新的或未讀的項。如需使用徽章，只需要把<spanclass="badge">添加到鏈接、Bootstrap導航等這些元素上即可。實例代碼如下：<ahref="#">Mailbox<spanclass="badge">50</span></a>以上實例代碼運行后結果是：徽章可以在激活狀態的膠囊式導航和列表導航中放置徽章。通過使用<spanclass=“badge”>來激活鏈接。實例代碼如下：<ulclass="navnav-pills"><liclass="active"><ahref="#">首頁<spanclass="badge">42</span></a></li><li><ahref="#">簡介</a></li><li><ahref="#">消息<spanclass="badge">3</span></a></li></ul>徽章以上實例代碼運行后結果是：如果沒有新的或未讀的信息條目，也就是說不包含任何內容，徽章組件能夠自動隱藏（通過CSS的:empty選擇符實現)。超大屏幕3超大屏幕這是一個輕量、靈活的組件，它能延伸至整個瀏覽器視口來展示網站上的關鍵內容。超大屏幕（Jumbotron），顧名思義該組件可以增加標題的大小，并為登陸頁面內容添加更多的外邊距（margin）。使用超大屏幕（Jumbotron）的步驟如下：（1）創建一個帶有class.jumbotron.的容器<div>。（2）除了更大的<h1>，字體粗細font-weight被減為200px。超大屏幕實例代碼如下：<divclass="jumbotron"><h1>Hello,world!</h1><p>Thisisasimpleherounit,asimplejumbotron-stylecomponentforcallingextraattentiontofeaturedcontentorinformation.</p><p><aclass="btnbtn-primarybtn-lg"href="#"role="button">Learnmore</a></p></div>超大屏幕以上實例代碼運行后結果是：超大屏幕如果需要讓巨幕組件的寬度與瀏覽器寬度一致并且沒有圓角，請把此組件放在所有.container元素的外面，并在組件內部添加一個.containe