line-height-propiedad-css

Nota: puedes leer una versión más sencilla de la propiedad line-height aquí. La propiedad Line-height especifica el espacio del salto de línea base de un texto.  Los valores son relativos al tamaño de la fuente del elemento y no existen valores negativos.Si dicho valor es un número, la altura de la línea se calcula multiplicando el tamaño de la fuente del elemento por dicho número. (Puedes ver un vídeo sobre la propiedad CSS Line-height, aunque recomendamos leer primero esta entrada).

La propiedad Line-height es compatible con la mayoría de los navegadores, aunque Internet Explorer (versiones 8 y anteriores) no soportan el valor «inherit».

Valores de la propiedad

Valor Descripción
normal Un salto de línea normal. Este es el que se encuentra por defecto.
number Un número que puede ser multiplicado con el tamaño de fuente para establecer la altura de la línea.
length Un salto de línea fixed en px, pt, cm, etc.
% Una altura de línea en porcentaje con el tamaño de la fuente establecido.
inherit Especifica que el valor de la propiedad del salto de línea se debe heredar del elemento padre.

Ejemplo de su funcionamiento

Un ejemplo con porcentajes (cabe destacar que la mayoría de los navegadores el tamaño estándar de salto de línea con porcentajes oscila entre 110% y 120%:

p.small {line-height:90%}
p.standard { 110%;}
p.big {line-height:200%}

Si lo deseamos podemos ver un ejemplo de W3Schools, donde podrás editarlo tú mismo directamente.

Un ejemplo con números:

p.standard {line-height: 0.5; }

Un ejemplo con píxeles:

p.standard {line-height: 10px; }

Si ya has aprendido esta guía, puedes continuar leyendo más guías para seguir aprendiendo.

Muchas gracias por habernos leído.

Vía | W3S