font-style

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Resumen

La propiedad font-style permite definir el aspecto de una familia tipográfica entre los valores: normal, italic (cursiva) y oblique.

Valor inicialnormal
Applies toall elements and text. It also applies to ::first-letter and ::first-line.
Heredableyes
Valor calculadocomo se especifica
Animation typeby computed value type; normal animates as oblique 0deg

Sintaxis

css
font-style: normal;
font-style: italic;
font-style: oblique;

/* Valores globales */
font-style: inherit;
font-style: initial;
font-style: unset;

Valores

normal

Escoge un tipo de letra clasificado como normal dentro de una familia de fuente.

italic

Escoge un tipo de letra etiquetado como italic, o, si una versión cursiva del tipo de letra no esté disponible, escoge un tipo de letra etiquetado como oblique en lugar de eso.

oblique

Escoge un tipo de letra etiquetado como oblique, o, si una versión oblique del tipo de letra no esté disponible, escoge un tipo de letra etiquetado como italic en lugar de eso.

Sintaxis formal

font-style = 
normal |
italic |
oblique <angle [-90deg,90deg]>?

Ejemplo

El ejemplo muestra los valores diferentes de font-style.

html
<p class="normal">This paragraph is normal.</p>
<p class="italic">This paragraph is italic.</p>
<p class="oblique">This paragraph is oblique.</p>
css
.normal {
  font-style: normal;
}

.italic {
  font-style: italic;
}

.oblique {
  font-style: oblique;
}

Ten en cuenta que no todas las fuentes tienen tipos de letra distintos para oblique y italic, si este no es el caso, los navegadores simulan el estilo que falta utilizando el tipo de letra presente.

Especificaciones

Specification
CSS Fonts Module Level 4
# font-style-prop

Compatibilidad con navegadores

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
font-style
italic
normal
oblique can accept an <angle>

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
See implementation notes.