font-variant-alternates
Resumen
La propiedad CSS font-variant-alternates
controla el uso de glifos alternos. Estos glifos alternos pueden ser referenciados por nombres alternativos en @font-feature-values
.
Las reglas-at definen nombres, para un tipo determinado de glifos alternativos (stylistic
, styleset
, character-variant
, swash
, ornament
o annotation
), asociándolos a un valor OpenType dado. Esta propiedad permite utilizar estos nombres de fácil uso (según se defina en @font-feature-values
) dentro de la hoja de estilos.
Valor inicial | normal |
---|---|
Applies to | all elements. It also applies to ::first-letter and ::first-line . |
Heredable | yes |
Valor calculado | como se especifica |
Animation type | discrete |
Sintaxis
font-variant-alternates: normal;
font-variant-alternates: historical-forms;
font-variant-alternates: stylistic(user-defined-ident);
font-variant-alternates: styleset(user-defined-ident);
font-variant-alternates: character-variant(user-defined-ident);
font-variant-alternates: swash(user-defined-ident);
font-variant-alternates: ornaments(user-defined-ident);
font-variant-alternates: annotation(user-defined-ident);
font-variant-alternates: swash(ident1) annotation(ident2);
/* Global values */
font-variant-alternates: initial;
font-variant-alternates: inherit;
font-variant-alternates: unset;
Valores
normal
-
Se deshabilita el uso de glifos alternos.
historical-forms
-
Se habilita la muestra de formas históricas , es decir, glifos que eran usados comúnmente en el pasado, pero no en la actualidad. Corresponde al valor de OpenType
hist
. stylistic()
-
Esta función habilita la muestra de alternos estilísticos. El parámetro es un nombre específico de fuente mapeado a un número. Corresponde al valor de OpenType
salt
, comosalt 2
. styleset()
-
Esta función habilita el uso de un conjunto de alternos estilísticos para caracteres. El parámetro es un nombre de fuente específico mapeado a un número. Corresponde al valor de OpenType
ssXY
, comoss02
. character-variant()
-
Esta función habilita el uso de un conjunto de alternos estilísticos para caracteres. Es muy similar a
styleset()
, aunque la variante aquí no crea glifos coherentes a un set de caracteres; los caracteres individuales tendrán estilos indipendientes, no necesariamente coherentes. El parámetro es un nombre específico de fuente mapeado a un número. Corresponde al valor de OpenTypecvXY
, comocv02
. swash()
-
Esta función habilita la muestra de glifos de tipografía swash. El parámetro es un nombre específico de fuente mapeado a un número. Corresponde a los valores de OpenType
swsh
ycswh
, comoswsh 2
ycswh 2
. ornaments()
-
Esta función habilita la muestra de ornamentas, que son florones y otros glifos de estilo dingbat. El parámetro es un nombre específico de fuente mapeado a un número. Corresponde al valor de OpenType
ornm
, comoornm 2
.Nota: para manteneer la semántica de la fuente, se invita a los diseñadores de fuentes a incluir ornamentas qoe no coincidan con caracteres zingbat de Unicode como variantes de ornamenta al caracter de viñeta (U+2022). Las fuentes bien diseñadas lo harán, aunque muchas otras fuentes no.
annotation()
-
Esta función habilita la muestra de anotaciones, como dígitos circulares o caracteres invertidos. El parámetro es un nombre de fuente específico mapeado a un número. Corresponde al valor de OpenType
nalt
, comonalt 2
.
Sintaxis formal
font-variant-alternates =
normal |
[ stylistic( <feature-value-name> ) || historical-forms || styleset( <feature-value-name># ) || character-variant( <feature-value-name># ) || swash( <feature-value-name> ) || ornaments( <feature-value-name> ) || annotation( <feature-value-name> ) ]
<feature-value-name> =
<ident> (en-US)
Ejemplo
HTML
<p>Firefox rocks!</p>
<p class="variant">Firefox rocks!</p>
CSS
p.variant {
font-family: Leitura Display Swashes;
font-variant-alternates: swash(2);
}
Resultado
Nota: se necesita la fuente Open Type Leitura Display Swashes instalada para que este ejemplo funcione
Especificaciones
Specification |
---|
CSS Fonts Module Level 4 # font-variant-alternates-prop |
Compatibilidad con navegadores
BCD tables only load in the browser