Bootstrap is using the font icon glyphicons, which contains 200 icons. There are a few things to note when using font icons:
1. Each icon font is composed of a base class and a corresponding icon class, such as:
<span class= "Glyphicon glyphicon-search" ></span>
2. Font icons cannot exist in conjunction with other elements and can only be used alone, using a span label and applying base classes and corresponding icon classes to spans. (as above code)
3, apply font icon span can not have any text content, also cannot have child element.
4. If you need to use text, you should add a space between the icon and the text.
Now we're officially starting with an example to make a button for a text icon. Naturally, first of all, write the HTML5 document format according to the requirement, and introduce the core files needed.
1. Create a button to add the. Btn class, this icon is called "OK", the code is as follows:
<button class= "btn" > OK </button>
2, now we want to add a checkmark icon to this button, check the font icon corresponding to. Glyphicon. Glyphicon-ok, now write these two classes to span and add them to the code:
<button class= "btn" >
<span class= "Glyphicon glyphicon-ok" ></span> OK
</button>
The effect is as follows:
3, you can also add the default style to this button. Btn-default, or. Btn-primary, the effect is as follows:
In the example above, the. Btn-primary class is used, the. Btn-default class style is canceled, and the font icon applied is glyphicon-remove.
