5.2.2 Texto
📄 Texto
O CSS oferece várias propriedades para estilizar textos, definindo desde a fonte usada até o tamanho e alinhamento. Vamos explorar as principais:
🔤 font-family
font-familyDefine a família da fonte do texto. Pode-se usar nomes de fontes específicos ou famílias genéricas como serif, sans-serif, monospace, etc.
Exemplo:
cssCopiarEditarp {
font-family: Arial, sans-serif;
}O navegador tenta usar a primeira fonte (Arial). Se não estiver disponível, usa a próxima (sans-serif).
Dica: Sempre use uma fonte reserva, separadas por vírgula.
🔠 font-size
font-sizeDefine o tamanho da fonte.
Exemplo:
cssCopiarEditarh1 {
font-size: 32px;
}Unidades comuns:
px(pixels): tamanho fixo.em: relativo ao elemento pai.rem: relativo ao elemento<html>.%: percentual do tamanho da fonte pai.
Exemplo com unidades diferentes:
cssCopiarEditarp {
font-size: 1.2em;
}📐 text-align
text-alignControla o alinhamento horizontal do texto.
Valores possíveis:
left: alinha à esquerda (padrão).right: alinha à direita.center: centraliza o texto.justify: justifica o texto (alinha nos dois lados).
Exemplo:
cssCopiarEditardiv {
text-align: center;
}📝 Exemplo completo:
cssCopiarEditararticle {
font-family: 'Georgia', serif;
font-size: 18px;
text-align: justify;
}Neste exemplo, o texto dentro da <article> será exibido com a fonte Georgia (ou serifada), tamanho 18px e alinhamento justificado.
Last updated