Here we are solving a basic problem faced by a beginner web developer in bootstrap i.e. designing glyphicons in bootstrap .

Objectives and Outcomes

In this, we will discuss about designing glyphicons in bootstrap

Glyphicons

The following example shows the code for inserting a glyphicon in your webpage:

<p>
    <a href="#"><span class="glyphicon glyphicon-envelope" style="font-size:50px;"></span></a>
</p>


To use the Bootstrap icons you will require a span tag along with a base class glyphicon and an individual icon class glyphicon-*. Where glyphicon-class-name is the name of the particular icon class defined in bootstrap.css.




Some other examples


<p><span class="glyphicon glyphicon-search"></span></p>
<p>
<button type="button" class="btn btn-default">
  <span class="glyphicon glyphicon-search"></span> Search
</button>
</p>
<p><span class="glyphicon glyphicon-signal"></span></p> 
<p>
<button type="button" class="btn btn-info">
  <span class="glyphicon glyphicon-search"></span> Search
</button>
</p>
<p>
<a href="#" class="btn btn-success btn-lg">
  <span class="glyphicon glyphicon-print"></span> Print 
</a>
</p> 

Print