La sintaxis de esta propiedad se basa en una notación abreviada tipográfica tradicional para establecer múltiples propiedades relacionadas con las fuentes.
Como dijo David M en los comentarios, refleja la tradición tipográfica de especificar los tamaños de tipo de letra como " x pt en y pt" para denotar el tamaño del glifo en la altura de la línea.
Pero el ejemplo en su pregunta es realmente incorrecto y sería ignorado por el navegador: solo puede combinar estas dos propiedades en la fontnotación abreviada, y debe especificar al menos tanto el tamaño de fuente como la familia. font: 100%/120%;Por lo tanto, simplemente escribir no es suficiente; Sin embargo, puede agregar un apellido genérico para que sea válido, por ejemplo:
Es para reflejar la antigua sintaxis de composición tipográfica, donde tendría una fuente establecida como, por ejemplo, "10pt en 12pt" o "10pt / 12pt".
David M
1
De hecho, uso esto bastante. El diseñador con el que trabajo siempre se refiere al tamaño como, por ejemplo, "14 sobre 22". Lo puse por accidente un día y me sorprendió / contento cuando funcionó.
Dylan Lukes
1
un resumen: ¿este formato tampoco requiere que se especifique la familia de fuentes? Mis navegadores están ignorando esta propiedad: fuente: 12px / 16px; pero aceptando esto: font: 12px / 16px sans-serif; Este comportamiento también se documenta aquí
kumarharsh 01 de
@ Harsh Sí, una familia (junto con un tamaño) es mínimamente requerida para la fontpropiedad de taquigrafía como se puede ver en la definición oficial .
Konrad Rudolph el
gracias por la aclaración. Quizás pueda actualizar la respuesta (o la pregunta) ya que es un poco engañoso ya que un lector casual puede suponer que solo una declaración SIZE / LINE_HEIGHT funcionaría.
kumarharsh 01 de
15
Konrad obtuvo este, pero hay muchas propiedades abreviadas de CSS como esta que puedes usar para acortar tus hojas de estilo. Algunos de ellos se ven un poco crípticos si no los conoce.
Sin embargo, la mayoría de las shorthands abordan propiedades de estilo relacionadas (por ejemplo border-*) David ha dado una buena explicación en los comentarios a mi respuesta. En cuanto a las manos cortas siendo crípticas: ciertamente cierto, pero muy útil y bastante fácil de aprender.
font-sizeNo acepta la barra. La propiedad correcta esfont.Respuestas:
Esto realmente establece dos propiedades y es equivalente a:
Para citar la documentación oficial :
Como dijo David M en los comentarios, refleja la tradición tipográfica de especificar los tamaños de tipo de letra como " x pt en y pt" para denotar el tamaño del glifo en la altura de la línea.
Pero el ejemplo en su pregunta es realmente incorrecto y sería ignorado por el navegador: solo puede combinar estas dos propiedades en la
fontnotación abreviada, y debe especificar al menos tanto el tamaño de fuente como la familia.font: 100%/120%;Por lo tanto, simplemente escribir no es suficiente; Sin embargo, puede agregar un apellido genérico para que sea válido, por ejemplo:fuente
fontpropiedad de taquigrafía como se puede ver en la definición oficial .Konrad obtuvo este, pero hay muchas propiedades abreviadas de CSS como esta que puedes usar para acortar tus hojas de estilo. Algunos de ellos se ven un poco crípticos si no los conoce.
fuente
border-*) David ha dado una buena explicación en los comentarios a mi respuesta. En cuanto a las manos cortas siendo crípticas: ciertamente cierto, pero muy útil y bastante fácil de aprender.