Propiedad CSS font-feature-settings
The font-feature-settings CSS property controls advanced typographic features in OpenType fonts. Read about the property and try examples.
La propiedad font-feature-settings controla las funciones tipográficas avanzadas en las fuentes OpenType. La propiedad acepta normal o uno o más pares <feature-tag-value>. normal es el valor predeterminado. Cada <feature-tag-value> consta de una cadena (la etiqueta de función de OpenType) seguida de un número entero (el valor de activación). Las palabras clave on y off son sinónimos de 1 y 0 respectivamente. Si no se especifica ningún valor, el valor inicial es normal. Se pueden especificar varias funciones como una lista separada por comas.
La propiedad font-feature-settings admite muchos otros valores, además de las ligaduras estándar, como las mayúsculas pequeñas (small caps). Sin embargo, la propiedad font-variant: small-caps es el método estándar para habilitarlas, por lo que font-feature-settings no debería usarse para este propósito.
Es posible que se necesiten prefijos para una mejor compatibilidad con los navegadores.
| Valor inicial | normal |
|---|---|
| Se aplica a | Todos los elementos. También se aplica a ::first-letter y ::first-line. |
| Heredado | Sí. |
| Animable | No. |
| Versión | CSS3 |
| Sintaxis DOM | object.style.fontFeatureSettings = "normal"; |
Sintaxis
Sintaxis de la propiedad CSS font-feature-settings
font-feature-settings: normal | <feature-tag-value># | initial | inherit;Ejemplo de la propiedad font-feature-settings:
Ejemplo de la propiedad CSS font-feature-settings con el valor smcp
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
h2 {
font-family: sans-serif;
}
h3 {
font-feature-settings: "smcp" 1;
}
</style>
</head>
<body>
<h2>Font-feature-settings example</h2>
<h3>The font-feature-settings CSS property controls advanced typographic features in OpenType fonts.</h3>
</body>
</html>Valores
| Valor | Descripción |
|---|---|
| normal | Este es el valor predeterminado de esta propiedad. |
| <feature-tag-value> | Al renderizar texto, la lista de valores de etiquetas de funciones de OpenType se pasa al motor de diseño de texto para habilitar o deshabilitar las funciones de la fuente. |
| initial | Hace que la propiedad utilice su valor predeterminado. |
| inherit | Hereda la propiedad de su elemento padre. |
Práctica
¿Para qué se utiliza la propiedad CSS font-feature-settings?