1
00:00:00,390 --> 00:00:03,720
Bootstrap includes two hundred and sixty glyph equations.

2
00:00:03,900 --> 00:00:12,510
They can be used in almost any HMO element including text buttons toolbars navigation informs this HMO

3
00:00:12,510 --> 00:00:17,870
page contain some examples of different icons you can use for a full list of icons.

4
00:00:17,910 --> 00:00:23,680
Visit the world below in order to display an icon on your page.

5
00:00:23,840 --> 00:00:31,910
Create a span element is shown here and add the graphic on class also.

6
00:00:31,930 --> 00:00:37,990
Add the class of the specific icon you want to use so we can see in this first example we start with

7
00:00:37,990 --> 00:00:44,600
the text envelope and next we have our span element.

8
00:00:44,680 --> 00:00:49,140
You can see that the span element is two classes glyph icon and graphic on envelope.

9
00:00:52,440 --> 00:00:53,330
And that's really all.

10
00:00:53,470 --> 00:01:02,830
All it takes to include an icon on your page the next three icons follow the exact same format.

11
00:01:02,840 --> 00:01:11,330
The only difference is we've changed the icon type so you can see we have search heart and star empty

12
00:01:15,500 --> 00:01:16,270
now.

13
00:01:16,390 --> 00:01:22,570
The next example we've embedded an icon inside a button.

14
00:01:22,810 --> 00:01:27,830
So we have the search graphic on inside these two buttons.

15
00:01:30,180 --> 00:01:35,440
And doing that is simple we use the same span element in the same class format.

16
00:01:36,300 --> 00:01:41,640
But we just inserted in-between our open and close button tags

17
00:01:45,220 --> 00:01:49,160
the next button is the same thing.

18
00:01:49,160 --> 00:01:51,570
We have a search bifurcation.

19
00:01:51,800 --> 00:01:58,520
The only difference is that this button uses the button warning class and that's why it's an orange

20
00:01:58,520 --> 00:02:02,350
color.

21
00:02:02,630 --> 00:02:05,230
And then there's just some other examples here.

22
00:02:05,270 --> 00:02:15,000
We have a print graphic on and lastly we've embedded a print graphic on inside

23
00:02:18,090 --> 00:02:28,290
a link element so you can see we start with the Open a tag we specify the class for this link which

24
00:02:28,290 --> 00:02:31,720
is Button Button success and button large.

25
00:02:32,190 --> 00:02:33,750
So that's what gives it this styling

26
00:02:36,960 --> 00:02:45,040
and next we just create our spend element and insert our two classes graphic on and graphic on print

27
00:02:45,890 --> 00:02:49,180
and that's what adds that icon right before the label print.