Using Bootstrap we can create a variety of different badges and labels to add emphasis to different
HMO elements.
We can see several examples on this.
Each GMO page starting with badges next to each link.
We can see a badge each containing a number to create this.
We simply need to create a spend and give it a class attribute equal to badge is shown here
the spend element is created.
In this case inside a link element we start with our a tags followed by their h ah yes attribute and
then the label for the link and then our spin element so the spend element in this case is it is given
the class badge and that's what creates this circle with the with the number inside.
We have a couple of other examples just with the different labels and different values.
Now here we see that button that badges can also be inserted into buttons.
So we have a button element and inside the button element we have our spend element.
And once again we've assigned the class badge in this particular stand has a value of 10.
As we see here that's the kind of effect it creates
the next block of code here is an example of labels attached to headings so we start with the heading
tag and insert our spend element inside the heading tag.
So we start with open each one the label for the heading and the spent element so this time since this
is we're creating a label.
We've used the label class and specified which label style we'd like to apply.
So in this case we have label primary in the next example we have label warning and then danger and
info.
So that's what gives each label its unique color and you can see that the label decreases in size along
with the headings.
So depending on which heading element you use the label will course label size will correspond to the
heading and we can create labels outside of any other element as well by simply using this band tags.
Here we have a series of labels each with a different label class.
So the first one is label and then label default label label primary and so on and so forth and you
can see that this is the end result here for this block of code.