Características font-style en CSS

Características font-style en CSS

La propiedad font-style CSS especifica si una fuente debe ser normal, cursiva u oblicua. El navegador elegirá la versión más adecuada del tipo de fuente font-family.

Funciones font-style css

Valor inicialnormal
Aplicado aTodos los artículos.
Heredable
MóvilNo
Valor calculadoComo se especificó.
/* palabras reservadas */ 
font-style: normal;
font-style: italic;
font-style: oblique;
/* valores globales */ 
font-style: inherit;
font-style: initial;
font-style: unset;

Una fuente en cursiva tiene algunas características de escritura a mano y generalmente ocupa menos espacio horizontal que una fuente normal, mientras que una fuente oblicua representa una versión sesgada en ángulo de una fuente normal. Cuando una versión personalizada en cursiva de la fuente no está disponible, la fuente cursiva y sesgada se verá igual.

Ejemplos y aplicaciones en código

Ejemplo de uso de la propiedad font-style con varios valores:

< p  class = "normal" > este párrafo en fuente normal </ p > 
< p  class = "italic" > este párrafo en cursiva </ p > 
< p  class = "oblique" > este párrafo en oblicuo </ p >

Código CSS:

.normal {
  font-style: normal;
}
.italic {
  font-style: italic;
}
.oblique {
  font-style: oblique;
}

Asegúrese de probar el ejemplo anterior con una fuente que tenga una versión en cursiva para que el efecto de este valor sea claro.

Soporte de navegadores

CaracterísticaChromeFirefoxIEÓperaSafari
Soporte básico1.01.04.07.01.0

Características generales

La propiedad acepta font-style una de las siguientes palabras reservadas.

normal

Defina la versión normal de la fuente.

italic

Elija una versión categorizada como cursiva, y si no hay una versión en cursiva disponible, se usará la versión sesgada de la fuente oblique, y si ambas versiones no están disponibles, la cursiva se emulará desde el navegador.

oblique

Elija una versión clasificada como oblicua, y si no hay una versión oblicua disponible, se utilizará la versión en cursiva de la fuente italic, y si ambas versiones no están disponibles, la fuente en cursiva se simulará desde el navegador.

Estructura font-style css

font-style: normal | italic | oblique;

Consulte también

  • La página de propiedades font que establece los valores de las font-weight subpropiedades font-size, font-size-adjust y line-height.
  • La página de propiedades color que establece el valor de color de los elementos.