Bootstrap Badges and Labels
Badges are numerical indicators of how many items are associated with a link:
Use the .badge class within <span> elements to create badges:
Badge in Button
. Badges can be used as part of links or buttons to provide a counter.
Badges scale to match the size of the immediate parent element by using relative font sizing and em units.
Users of screen readers and other assistive tools may find badges perplexing depending on how they're used. While badges' style gives people a visual clue as to what they're for, these users will only see the badge's content. Depending on the situation, these badges may appear as random extra words or numbers at the end of a sentence, a link, or a button.
Consider incorporating more context using a visually hidden piece of additional text unless the context is evident (as in the "Notifications" example, where it is recognised that the "4" represents the number of notifications).
Add any of the below mentioned modifier classes to change the appearance of a badge.
Use the .badge-pill modifier class to make badges more rounded (with a larger border-radius and additional horizontal padding). Useful if you miss the badges from v3.
Links using Badges
Using the contextual .badge-* classes on an <a> element quickly provide actionable badges with hover and focus states.
Labels are used to provide additional information about something:
Use the .label class, followed by one of the six contextual classes .label-default, .label-primary, .label-success, .label-info, .label-warning or .label-danger, within a <span> element to create.
ATutorialHub Related Guide
AWS Amazon EC2-Deploy a MERN Stack application to AWS Amazon EC2
Sea battle game only using HTML and CSS
panduranga gupta2021-07-05 07:03:13
good website for learning and help me a lot
The awsome website i am looking like for a long time, good work atutorialhub team keep doing
Learning a lot from the courses present on atutorialhub. The courses are very well explained. Great experience
It is very helpful to students and easy to learn the concepts
Great job Tutorials are easy to understand Please make use of it
Zain Khan2021-09-18 15:07:23
Great content and customized courses.
Rudrakshi Bhatt2021-09-09 15:08:10
Well structured coursed and explained really well!
Pavana Somashekar2021-09-11 15:09:08
Good platform for beginners and learn a lot on this website