Fontes

Podemos especificar o tipo de fonte a ser utilizado com a declaração font-family. É um bom hábito usar 'save combinations' ao especificar mais de uma fonte, pois isso garante que caso a primeira fonte especificada falhe, a próxima será usada.

Outras configurações

Existem algumas declarações CSS que podemos usar para definir outras propriedades da fonte do texto.

• font-size: Configura o tamanho do texto, podendo-se usar unidades absolutas ou relativas. O tamanho padrão do texto é de 16px = 1em;
• font-weight: Configura o peso ou negrito do texto. Os valores possíveis dependem da fonte utilizada. Os seguintes valores são possíveis: normal, bold, lighter, bolder e valores numericos que variam de 100 até 900;
• font-style: Usado para configurar o itálico do texto. De forma geral, assume os valores normal ou italic;
• text-decoration: Configura o estilo de decoração das linhas. Os seguintes valores podem ser usados: none, overline, underline e line-through;
• font-variant: Permite usar algumas variantes da fonte. Entre os valores possíveis, pode assumir: normal e small-caps;
• line-height: Usado para configurar a distância entre as linhas de texto. Pode-se usar o valor normal para configurar o valor padrão.

Em vez de configurar as propriedades em declarações separadas podemos usar uma shorthand para fazer todas as configurações em uma declaração.

    font: style variant weight size/line-height family

Tamanhos

Para declarações CSS que lidam com tamanhos, pode-se utilizar diferentes unidades de medida.

• Unidades absolutas
  • centímetro: cm
  • milímetro: mm
  • polegada: in
  • píxel: px [é o padrão]
  • ponto: pt
  • paica: pc
• Unidades relativas
  • tamanho do elemento tipográfico 'M': em
  • tamanho horizontal da janela do navegador: vw (viewport width);
  • tamanho vertical da janela do navegador: vh (viewport height);
  • porcentagem: %

Subtítulo

Lorem ipsum dolor sit amet consectetur adipisicing elit. In maiores perferendis inventore expedita consectetur. Aliquid incidunt pariatur earum perferendis inventore, et at doloribus, dolor blanditiis nostrum atque, ab ipsam in.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Deserunt autem ex amet blanditiis quam maiores ipsam, ab quia expedita eveniet nobis cum architecto sequi quo vero tenetur ratione dolores! Perspiciatis. Lorem ipsum dolor, sit amet consectetur adipisicing elit. Inventore earum praesentium deleniti? Recusandae, ab odio laboriosam temporibus voluptatem nisi id soluta, quisquam incidunt ipsum corporis ducimus quo vitae, officia necessitatibus?

Lorem ipsum dolor sit, amet consectetur adipisicing elit. Dolorum sint, doloribus sit, laudantium, non error veritatis praesentium mollitia corrupti quibusdam dolorem omnis inventore voluptates. Praesentium deleniti quisquam magnam possimus ex. Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatum quisquam natus facere modi at culpa dolore voluptatem corrupti velit maiores. Explicabo quaerat consequatur nostrum suscipit doloremque autem harum eligendi pariatur.