Ordem para utilização shothand
font: style weight size, family, outra_family;
| Comando | Função |
|---|---|
| font-style: ; | Estilo de fonte |
| font-weight: ; | Peso da fonte |
| font-size: ; | Tamanho da fonte |
| font-family: ; | Aplica estilo de fonte |
É possível enriquecer o site com fontes externas:
Basta colar os links fornecidos no <head> da pagina HTML e referenciar o nome na font-family do componente desejado.
Referencie o @import no inicio da pagina CSS e declare no font-family do componente desejado.
Para este se fará necessário criar o @font-face
@font-face
{
font-family: 'nome_desejado' ;
src: url('localização/nome_arquivo.otf') format('formato'), outras url format... ;
font-weight: ' normal ', ... ;
font-style: ' normal ', ... ;
}
| Extensão | formato |
|---|---|
| .otf | opentype |
| .ttf | truetype |
| embedded-opentype | |
| truetype-aat | |
| svg |
Depois disso basta referenciar com o nome_desejado.
| Comando | Função |
|---|---|
| text-align: ; | Alinhamento de Texto |
| text-indent: ; | Alinhamento de inicio de texto |
| text-shadow: ; | Sombra de texto |
| text-decoration: ; | Tira ou acrescenta elementos |
| text-transform: ; | Altera forma da fonte |
| Comando | Função |
|---|---|
| width: ; | Largura |
| height: ; | Altura |
| padding: ; | Espaçamento interno |
| margin: ; | Espaçamento externo |
| border-radius: ; | Raio da borda |
| box-shadow: ; | Sombra do Elemento |
| border: ; | Borda |
| border-image: ; | Borda |
| transition: ; | Visualizar Transformação |
| cursor: ; | Formato do ponteiro |
| transform: ; | Transforma o elemento |