Rogério Lino

Web development and tips

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

Comments