Propriedade font-style
Última atualização: 2026-09-13
font-style Propriedade font-style
A propriedade font-style do CSS define se o texto é renderizado em estilo itálico ou oblíquo. Ela aceita três valores — normal, italic e oblique — e é frequentemente usada para citações, ênfase e tipografia especial.
| Categoria | |
|---|---|
| Valor Inicial | normal |
| Herdado | Sim |
| Aplica-se A | all |
| Tipo de Animação | discrete |
| Versão CSS | CSS1 |
| Status | Padrão |
📝 Sintaxe
font-style: normal | italic | oblique <angle>?;⚙️ Valores
| Valor | Tipo | Descrição |
|---|---|---|
normal | italic | oblique | Palavra-chave | Estilo da fonte: normal, italic ou oblique |
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo no playground:
🌐 Suporte dos Navegadores
| Navegador |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| font-style | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os principais navegadores | |||||
Dica： italic usa as próprias variantes itálicas da fonte, enquanto oblique inclina os glifos artificialmente; quando uma fonte não tem versão itálica, as duas se comportam quase de forma idêntica.
❓ Perguntas Frequentes
QQual é a diferença entre os estilos de fonte italic e oblique?
Aitalic usa os glifos itálicos especialmente desenhados pela fonte, enquanto oblique inclina os glifos normais mecanicamente para criar um visual pseudo-itálico. Se uma fonte não tem versão itálica, os navegadores substituem italic por oblique, tornando as duas parecidas. O CSS também permite especificar um ângulo, por exemplo oblique 10deg.
QComo deixo o texto em itálico usando a propriedade font-style no CSS?
ADefina font-style: italic (resultado melhor, recomendado) ou font-style: oblique (inclinação forçada). Isso é frequentemente aplicado a títulos de livros, palavras estrangeiras e ênfase. Observe que os elementos em e i são itálicos por padrão; use font-style: normal para remover o itálico.
QComo font-style: italic difere de usar transform: skew no CSS?
Afont-style é uma configuração tipográfica que seleciona glifos itálicos ou os inclina levemente sem afetar a caixa do elemento; transform: skew() distorce geometricamente o elemento inteiro, incluindo seu fundo e borda. Use font-style para itálicos comuns e evite skew como substituto.
🏷️ Propriedades Relacionadas
💡 Casos relacionados
📚 Tutoriais Relacionados
