tutoriais mais recente desenvolvimento web
 

Bootstrap Glyphicons


Glyphicons

Bootstrap fornece 260 glyphicons do Glyphicons conjunto Halflings.

Glyphicons pode ser usado no texto, botões, barras de ferramentas, navegação, formulários, etc.

Aqui estão alguns exemplos de glyphicons :

glyphicon Envelope:

Imprimir glyphicon:

Pesquisa glyphicon:

Baixar glyphicon:


Glyphicon Sintaxe

A glyphicon está inserido com a seguinte sintaxe:

<span class="glyphicon glyphicon- name "></span>

A parte do nome na sintaxe acima deve ser substituído com o nome próprio do glyphicon.


Exemplo Glyphicon

O exemplo a seguir mostra maneiras diferentes de usar glyphicons:

Exemplo

<p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
<p>Envelope icon as a link:
  <a href="#"><span class="glyphicon glyphicon-envelope"></span></a>
</p>
<p>Search icon: <span class="glyphicon glyphicon-search"></span></p>
<p>Search icon on a button:
  <button type="button" class="btn btn-default">
    <span class="glyphicon glyphicon-search"></span> Search
  </button>
</p>
<p>Search icon on a styled button:
  <button type="button" class="btn btn-info">
    <span class="glyphicon glyphicon-search"></span> Search
  </button>
</p>
<p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
<p>Print icon on a styled link button:
  <a href="#" class="btn btn-success btn-lg">
    <span class="glyphicon glyphicon-print"></span> Print
  </a>
</p>
Tente você mesmo "

Teste-se com exercícios!

Exercício 1 » Exercício 2» Exercício 3 »


Conclua Bootstrap Glyphicon Referência

Para uma referência completa de todos os glyphicons, vá para nossa completa Bootstrap Glyphicon Referência .