Bootstrap < Fundamentals 21 > Badge (badges)

Original: Bootstrap < basic 21 > badge (badges)

Bootstrap badge (badges). Badges are similar to labels, and the main difference is that the edges of the badges are more rounded.

Badges (badges) are primarily used to highlight new or unread items. To use badges, simply add the <span class= "badge" > to these elements such as links, Bootstrap navigation, and so on.

The following example demonstrates this:

<! DOCTYPE html>
The results are as follows:
When there are no new or unread items, through CSS : The empty selector, the badge folds up to indicate that there is no content inside.
Activating navigation State
 You can place badges in the capsule navigation and list navigation in the activation state. by using    <span class= "badge";    to activate the link, as shown in the following example: 
<! DOCTYPE html>Home Page</a> </li> <li><a href= "#" > Introduction </a></li> <li> <a href= "#" > <span class= "badge pull-right" >3</span>message</a> </li></ul></body>
The results are as follows:
Series Articles:Bootstrap < Fundamentals > CSS Overview
bootstrap< Basic two > network system
bootstrap< Basic three > typesetting
bootstrap< basic Four > code
Bootstrap < Fundamentals five > forms
bootstrap< basic six > form
Bootstrap < basic seven > button
Bootstrap < basics eight > pictures
bootstrap< Basic Nine > Auxiliary class
bootstrap< Basic 10 > responsive Utility
bootstrap< Basic 11 > Font icons (glyphicons)
Bootstrap < Basics 12 > drop-down menu (dropdowns)
bootstrap< Basic 13 > button Group
bootstrap< Basic 14 > button drop-down menu
bootstrap< Basic 15 > Input Frame Group
bootstrap< basic 16 > Navigation elements
bootstrap< basic 17 > Navigation Bar Bootstrap < basic 18 > Breadcrumb navigation (Breadcrumbs) Bootstrap < Fundamentals 19 > Pagination bootstrap< Basics 20 > Tags Bootstrap < fundamentals 21 > badges (Badges) Bootstrap < basic 22 > Oversized screen (Jumbotron) Bootstrap < basic 23 > page title Header) bootstrap< Basic 24 > Thumbnail Bootstrap < basic 25 > Warning (Alerts) Bootstrap < basic 26 > progress bar
Bootstrap < Fundamentals 21 > Badge (badges)