Medida de separación entre las líneas de un párrafo: line-height

Establece la altura de línea entre líneas de texto.

Un ejemplo para este estilo es:

<!DOCTYPE html>
<html>
<head>
<style>
    /* Estilo personalizado para el párrafo con line-height */
    .texto-con-line-height {
        line-height: 1.5; /* Aquí puedes ajustar el valor según tus preferencias */
    }
      .texto-con-line-height-2{
        line-height: 10
          ; /* Aquí puedes ajustar el valor según tus preferencias */
    }
</style>
</head>
<body>
<h1>Ejemplo de Line-Height</h1>
<p>Este es un párrafo de texto con line-height por defecto. El valor de la altura de línea es el normal del navegador.</p>
<p class="texto-con-line-height">Este es un párrafo de texto con line-height personalizado. La altura de línea es ajustada a 1.5 veces el tamaño de la fuente.</p>
  
<p class="texto-con-line-height-2">Este es otro párrafo de texto con line-height por defecto. La altura de línea sigue siendo la predeterminada. Holaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
  </body>
</html>

El párrafo con el identificador "texto-con-line-height" tiene una altura de 1.5, de modo que todas las lineas de este párrafo distan unos de otros 1.5 (sin unidad).

El párrafo con el identificador "texto-con-line-height-2" tiene una altura de 10, de modo que las líneas de este párrafos están más separados como se ve en el ejemplo 22.

Para aprender a controlar los espacios entre caracteres, haz clic aquí.

Comentarios

Entradas populares de este blog

Editables