40 lines
1.3 KiB
Markdown
40 lines
1.3 KiB
Markdown
|
---
|
||
|
title: Fontawesome Icons For Bootstrap
|
||
|
localeTitle: Ícones Fontawesome Para Bootstrap
|
||
|
---
|
||
|
## Ícones Fontawesome Para Bootstrap
|
||
|
|
||
|
Bootstrap (versão 4) caiu fonte de ícones Glyphicon em sua última versão. Os ícones do Fontawesome fornecem mais de 675 ícones, eles vêm em formato de fonte.
|
||
|
|
||
|
#### Como usar:
|
||
|
|
||
|
No `<head>` do seu html, inclua uma referência ao Font Awesome.
|
||
|
|
||
|
```html
|
||
|
|
||
|
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
|
||
|
```
|
||
|
|
||
|
Usar fontawesome é o mesmo que usar o Glyphicon.
|
||
|
|
||
|
Basta criar uma tag `<i>` ou `<span>` e aplicar o prefixo CSS `fa` e o nome do ícone. Um exemplo de código foi fornecido abaixo.
|
||
|
|
||
|
**Exemplo de código:**
|
||
|
|
||
|
`<i class="fa fa-twitter" aria-hidden="true"></i>`
|
||
|
|
||
|
`<span class="fa fa-freecodecamp" aria-hidden="true"></span>`
|
||
|
|
||
|
#### Lista de ícones do Fontawesome:
|
||
|
|
||
|
A lista completa de ícones fornecidos pelo fontawesome está disponível [aqui](http://fontawesome.io/cheatsheet/)
|
||
|
|
||
|
`.fa fa-align-left` Este é o fontawesome alinhado à esquerda.
|
||
|
|
||
|
`.fa fa-heart` Este é o ícone do coração fontawesome.
|
||
|
|
||
|
_Nota: Não inclua o ponto no Atributo de Classe HTML, referindo-se às classes com um ponto só é usado ao ajustar as classes em CSS._
|
||
|
|
||
|
#### Mais Informações:
|
||
|
|
||
|
[Cheatsheet Fontawesome](http://fontawesome.io/cheatsheet/)
|