Propriedade de Atalho de Fonte
Última atualização: 2026-09-13
font Propriedade de Atalho de Fonte
A propriedade de atalho font do CSS define todas as sub-propriedades relacionadas à fonte em uma única declaração: font-style, font-variant, font-weight, font-stretch, font-size, line-height e font-family. Mantém as folhas de estilo concisas, mas font-size e font-family são obrigatórios e as sub-propriedades devem seguir uma ordem fixa.
| Categoria | |
|---|---|
| Valor Inicial | normal normal normal 1em/normal system-ui |
| Herdado | Sim |
| Aplica-se A | all |
| Tipo de Animação | font-weight |
| Versão CSS | CSS1 |
| Status | Padrão |
📝 Sintaxe
font: [ <font-style> || <font-variant> || <font-weight> || <font-stretch> ]? <font-size> [ / <line-height> ]? <font-family>;
⚙️ Valores
| Valor | Tipo | Descrição |
|---|---|---|
<font-style> || <font-variant> || <font-weight> || <font-size> / <line-height> || <font-family> | Valor | Atalho de fonte para todas as sub-propriedades de fonte |
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo no playground:
🌐 Suporte dos Navegadores
| Navegador | |||||
|---|---|---|---|---|---|
| font | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os principais navegadores | |||||
Importante: font-size e font-family são obrigatórios; se faltar um deles, toda a declaração é ignorada.
Dica: O atalho redefine qualquer sub-propriedade omitida para seus valores iniciais, então declare font antes de outras regras que definem propriedades de fonte individuais.
❓ Perguntas Frequentes
QDevo usar o atalho font ou definir sub-propriedades individualmente?
AUse o atalho quando precisar definir várias propriedades de fonte de uma vez — estilo, peso, tamanho, altura de linha e família — em uma única linha. No entanto, ele redefine cada sub-propriedade omitida para seu valor inicial, então quando você só quer mudar um valor (por exemplo, mudar font-weight para bold), escreva a propriedade completa em vez disso para evitar apagar suas outras configurações.
QA ordem dos valores do atalho font importa no CSS?
ASim. font-style, font-variant, font-weight e font-stretch são opcionais e podem aparecer em qualquer ordem antes de font-size. font-size deve ser seguido por um /line-height opcional, e font-family deve vir por último. Ambos font-size e font-family são obrigatórios — se faltar um, toda a declaração é ignorada.
QO que significa font: italic bold 20px/1.5 'Microsoft YaHei', sans-serif?
ADefine font-style como italic, font-weight como bold, font-size como 20px e line-height como 1,5 vezes o tamanho da fonte. A lista font-family tenta Microsoft YaHei primeiro e recorre ao sans-serif genérico se não estiver instalado. Sub-propriedades omitidas como font-variant são redefinidas para seu valor inicial normal.