Bootstrap - Huy hiệu
Chương này sẽ thảo luận về huy hiệu Bootstrap. Phù hiệu tương tự như nhãn; sự khác biệt chính là các góc được làm tròn hơn.
Huy hiệu chủ yếu được sử dụng để đánh dấu các mục mới hoặc chưa đọc. Để sử dụng huy hiệu chỉ cần thêm<span class = "badge"> đến liên kết, nav Bootstrap, v.v.
Ví dụ sau đây chứng minh điều này -
<a href = "#">Mailbox <span class = "badge">50</span></a>
Khi không có mục mới hoặc chưa đọc, huy hiệu sẽ đơn giản thu gọn thông qua CSS :empty bộ chọn, miễn là không có nội dung nào tồn tại bên trong.
Hải quân đang hoạt động
Bạn có thể đặt huy hiệu ở trạng thái hoạt động của máy tính bảng và điều hướng danh sách. Bạn có thể đạt được điều này bằng cách đặt<span class = "badge"> đến các liên kết đang hoạt động, như được minh họa trong ví dụ sau:
<h4>Example for Active State in Pill </h4>
<ul class = "nav nav-pills">
<li class = "active"><a href = "#">Home <span class ="badge">42</span></a></li>
<li><a href = "#">Profile</a></li>
<li><a href = "#">Messages <span class = "badge">3</span></a></li>
</ul>
<br>
<h4>Example for Active State in navigations</h4>
<ul class = "nav nav-pills nav-stacked" style = "max-width: 260px;">
<li class = "active">
<a href = "#">
<span class = "badge pull-right">42</span>
Home
</a>
</li>
<li><a href = "#">Profile</a></li>
<li>
<a href = "#">
<span class = "badge pull-right">3</span>
Messages
</a>
</li>
</ul>