CSS Reference #3

Terceira referência de CSS agora mostrando a propriedade Font.

FONT

font-style: define o estilo da font.

nomal: não muda nada, a font fica na vertical.

italic: deixa a font em itálico, inclinada.

oblic: converte a font oblíqua.

font-variant: mostra o texto com todas as letras em maiúsculo mas mantendo o tamanho diferente entre maiúsculas e minúsculas.

normal: não altera a font.

small-caps: transforma em maiúscula de menor altura.

font-weight: define o quanto a font é mais pesada, mais escura.

normal: não altera.

bold: negrito.

bolder: um pouco mais escuro que bold.

lighter: um pouco mais claro que bold.

Ou pode setar uma centena para definir o valor: 100, 200, 300, 400, 500, 600, 700, 800, 900.

font-size : tamanho da font, altura. Pode tanto definir um valor numa medida aceita pelo CSS (px, em, pt, cm…), porcentagem, ou um tamanho pré-definido abaixo, do menor para o maior:

xx-small, x-small, smaller, small, medium, large, larger, x-large, xx-large,

font-family: o tipo da font (o nome), podendo definir uma lista de maior prioridade dos tipo mais à esquerda separando por vírgula. Caso o usuário não tenha determinada font passa à próxima, assim sucessivamente. Para nomes complexo adicionar aspas dupla.

ex: Verdana, Arial, Tahoma, “Comic Sans MS”, Sans-Serif;

color: aplica uma cor desejada à font (Hexadecimal, RGB ou nome em inglês).

ex: #FF0000;

ex: red;

ex: rgb(255, 0, 0);

font: jeito simplificado de escrever tudo. Ficando nessa seguinte ordem os valores: [style] [variant] [weight] [size] [line-height] [family].

Sendo os valores size e family obrigatórios os demais assumem o valor padrão.

ex: font: italic small-caps bold 12px Arial, Tahoma, Sans-Serif;

ex: font: 12px Arial, Tahoma, Sans-Serif;

mais sobre:

Maujor – A Propriedade Font

W3Schools – CSS Reference

One thought on “CSS Reference #3

Deixe uma Resposta

Preencha os seus detalhes abaixo ou clique num ícone para iniciar sessão:

Logótipo da WordPress.com

Está a comentar usando a sua conta WordPress.com Terminar Sessão / Alterar )

Imagem do Twitter

Está a comentar usando a sua conta Twitter Terminar Sessão / Alterar )

Facebook photo

Está a comentar usando a sua conta Facebook Terminar Sessão / Alterar )

Google+ photo

Está a comentar usando a sua conta Google+ Terminar Sessão / Alterar )

Connecting to %s