Bootstrap V2 Icons
In this tutorial, you will learn how to use the Bootstrap 2.0 toolkit to create icons. Bootstrap icons are provided by Glyphicons. If you use these icons in your project, make sure to include a link to (http://glyphicons.com/).
All icon images are bundled together and used via the (#). The image file is glyphicons-halflings.png, located in the img folder under the main Bootstrap directory. The styles for the icons and their background positions are defined between lines 1168 and 1544 in bootstrap.css. Note that to avoid conflicts, all icon classes use "icon-" as a prefix. Bootstrap 2.0 defines 120 icon classes.
The general syntax for using icons on a site or app is as follows:
where "icon_class_name" is the name of the icon class defined in bootstrap.css (e.g., icon-music, icon-star, icon-user, etc.).
If you want to use white icons, add an additional icon-white class, as shown below:
When using icons with accompanying text, remember to add some space after the icon. This situation may occur when using icons in buttons or navigation links.
## Example
Example of Using Search Icon in Bootstrap Version 2.0
form {
margin-top: 50px;
}
## View Online
[View the above example in different browser windows.](#)
## Example
Using Icons in Navigation with Bootstrap Version 2.0
##
YouTip