
La propiedad font-size-adjust en CSS dice que el tamaño de fuente debe elegirse en función de la altura de las minúsculas en lugar de la altura de las letras mayúsculas. Esto es útil porque la legibilidad de las fuentes, especialmente si son de tamaño pequeño, estarán determinadas por el tamaño de las letras minúsculas, no mayúsculas.
Funciones font-size-adjust css
Valor inicial | none |
---|---|
Aplicado a | Todos los artículos. |
Heredable | Sí |
Móvil | Sí |
Valor calculado | Como se especificó. |
/* Usa el tamaño de fuente especificado */ font-size-adjust: none; /* El uso de un tamaño de fuente hará que las letras minúsculas sean la mitad de la altura del tamaño de fuente especificado */ font-size-adjust: 0 . 5; /* valores globales */ font-size-adjust: inherit; font-size-adjust: initial; font-size-adjust: unset;
Ejemplos y aplicaciones en código
Un ejemplo del uso de la propiedad font-size-adjust
para mostrar la fuente en un tamaño adecuado, incluso si es pequeña:
< p > Ejemplo: font-size-ajustar </ p > < br > < div class="times" > Times (10px) Esta fuente es Que es difícil de leer en tamaño pequeño. </ div > < p > < div class = "verdana" > Verdana (10px) Esta es la fuente sans - fuente serif que es mucho más clara, porque es una fuente </ div > < br > < p > Ahora vamos a hacer la edición: </ p > < p > < div clase = "adjtimes" > Fuente 10px Times Verdana ha cambiado de tamaño para que sea el mismo que la fuente Fabuloso, ¿no? </ div >
Código CSS:
.times { font-family: Times, serif; font-size: 10px; } .verdana { font-family: Verdana, sans-serif; font-size: 10px; } .adjtimes { font-family: Times, sans-serif; font-size-adjust: 0.58; font-size: 10px; }
Soporte de navegadores
Característica | Chrome | Firefox | IE | Ópera | Safari |
---|---|---|---|---|---|
Soporte básico | 43,0 * | 3,0 | No soportado | 30,0 * | No soportado |
* La aplicación de esta función a los navegadores Chrome y Opera aún es experimental, y la opción «Habilitar funciones experimentales de la plataforma web» debe estar activada chrome://flags
o desactivada opera://flags
. A diferencia de IE, el navegador Edge admite esta función.
Características generales
La propiedad acepta font-size-adjust
uno de los dos valores siguientes.
none
Elija el tamaño de fuente según la propiedad font-size
únicamente.
<number>
Elija el tamaño de fuente para que la altura de las minúsculas (que se especifica por la altura x de la fuente utilizada) sea igual al producto de multiplicar este valor por el valor de la propiedad font-size
.
Este valor generalmente debe ser la relación entre la altura x y el tamaño de la primera fuente utilizada en la propiedad font-family
, lo que significa que la primera fuente será del mismo tamaño en todos los navegadores, admitan font-size-adjust
o no la función .
Estructura font-size-adjust css
font-size-adjust: none | <number>;
Consulte también
- La página de propiedades
font
que establece los valores de lasfont-style
subpropiedadesfont-weight
,font-size
yline-height
. - La página de propiedades
color
que establece el valor de color de los elementos.
- Propiedades float en CSS
- Propiedad clear en CSS
- Introducción al Lenguaje de Programación CSS
- Diferencias entre SASS y SCSS
- Características z-index en CSS
- Características width en CSS
- Características visibility en CSS
- Características top en CSS
- Características text-decoration-style en CSS
- Características text-decoration-line en CSS
- Características text-decoration-color en CSS
- Características text-decoration en CSS
- Características text-align-last en CSS
- Características text-align en CSS
- Características tab-size en CSS
- Características right en CSS
- Características position en CSS
- Características padding-top en CSS
- Características padding-right en CSS
- Características padding-left en CSS
- Características padding-bottom en CSS
- Características padding en CSS
- Características overflow-y en CSS
- Características overflow-x en CSS
- Características overflow-wrap en CSS
- Características overflow en CSS
- Características order en CSS
- Características min-width en CSS
- Características min-height en CSS
- Características max-width en CSS
- Características max-height en CSS
- Características margin-top en CSS
- Características margin-right en CSS
- Características margin-left en CSS
- Características margin-bottom en CSS
- Características line-height en CSS
- Características line-break en CSS
- Características letter-spacing en CSS
- Características left en CSS
- Características justify-content en CSS
- Características height en CSS
- Características font-weight en CSS