- Introduction and Installation
- Buttons, Glyphicons, Tables
- Vertical Forms, Horizontal Forms, Inline Forms
- DropDowns and Responsive Tabs
- Progress Bar and Jumbotron
We all have seen some numerical indicators beside some links in various websites. These are called badges. These badges tells how many items are available or associated with the link.
To add a badges to your webpage, add a class .badge to a span element like this-
Badges inside buttons
To insert badges inside buttons, add a class .badge to a button element like this-
We all have seen some additional information beside some links in various websites. These are called lables. These lables tells additional information about the link or text.
To add a lables to your webpage, add a class .lable to a span element like this-
- Use the following classes to style the colour of the lable
Grey – lable-default
Green – lable-success
Blue – lable-info
Red – lable-danger
We all have seen a box around some text or any information in various websites. These are called panels. These panels are bordered box with some padding which can be easily added around some text using bootstrap classes.
The content we need to write inside the panel is written in a div element with a class.panel-body
To add a panels to your webpage, add a class .panel to a div element like this-
Grey – panel-default
Green – panel-success
Blue – panel-info
Red – panel-danger
Page header allows us to write a heading on our webpage with proper spacing around it so that it can be distinguished from other text on the webpage.
To add a pageheader to your webpage, add a class .page-header to a div element like this-
Please write comments if you find anything incorrect, or you want to share more information about the topic discussed above.
This article is attributed to GeeksforGeeks.org