802 Shares 2840 views

Ajustes en el CSS: interlineado

En CSS, la distancia entre líneas es muy fácil de configurar. Para este fin hay una propiedad especial. Pero, por supuesto, hay muchos otros parámetros, que son universales y se pueden aplicar al texto.

Si se realiza ningún ajuste, que se ajustan a valores por defecto. se puede cambiar la distancia si se desea. El valor puede ser un porcentaje o píxeles.

Alto de fila

La distancia entre las líneas de CSS se puede demostrar mediante la siguiente figura.

En la imagen anterior muestra los parámetros con las distancias correspondientes. El texto está en el espacio de tamaño de fuente. Tenga en cuenta que la línea de texto no se inicia en la base y ligeramente superior. El espacio proporcionado a continuación a las cartas que tienen elementos de fondo (G, Y, y así sucesivamente).

Tenga en cuenta que el espacio entre los bloques de tamaño de fuente se llama guiando. Con HTML y CSS esta propiedad no aparece, pero es en los otros editores de texto y gráficos. Por ejemplo, en Adobe Photoshop.

La figura anterior muestra en qué parte del "Photoshop", puede especificar que lleva. Y al lado determinado ajuste de tamaño de fuente.

Ejemplos del uso de línea de altura

En CSS, la distancia entre las líneas se puede ajustar por ciento. Un ejemplo ilustrativo es la siguiente.

En el caso de valores pequeños del usuario de su sitio será un inconveniente para leer.

La distancia puede ser variada y el tamaño de la fuente. Si la diferencia entre los parámetros básicos diferirá en gran medida en número, la diferencia se compensa por el aumento líder.

sutilezas de diseño

La distancia entre las líneas de CSS puede personalizar aún más distintos guiones. Considere el ejemplo en la figura.

En el "elemento" en este caso será el texto. Relleno – relleno está dentro del objeto, y el margen de – la indentación del objeto. Border – este marco. Puede ser 0 píxeles, y puede ser 100.

La siguiente imagen muestra inmediatamente todos los márgenes, el marco y la altura de una línea de texto.

Si usted tiene un pequeño texto, todo en una sola línea, o cada línea en un párrafo aparte, la distancia se puede ajustar entre los párrafos con sangría. Es decir maring y el relleno entre las líneas en una celda no tendrá ningún efecto. Crean la sangría sólo en los bordes del objeto. Objeto – todo este párrafo, en lugar de líneas en él. Es importante que no se confunda.

En los casos en que un gran número de filas, todos los cuales están ubicados en el mismo objeto, se recomienda el tipo de letra para cambiar los parámetros básicos.

¿Cómo aumentar la distancia entre las líneas de CSS

La distancia entre las líneas de HTML, puede registrar a cualquier clase o para todos los párrafos en el texto. Si especifica así: p {line-height: 20px; } – entonces absolutamente todos los párrafos de la página serán cadenas de 20 píxeles. Si quieres en diferentes lugares en diferentes tamaños, se recomienda hacer de la siguiente manera.

Prescribimos estilos.

.class1 {line-height: 20px; }

.class2 {line-height: 16px; }

.class3 {line-height: 12px; }

Para mayor claridad, se añade un marco, por lo que puede ver que funciona. En el futuro, se debe eliminar.

A continuación, utilizamos estas clases. El resultado es el siguiente.

Tenga en cuenta que en el tercer caso, la banda se dirigió al texto. Todo debido al hecho de que el tamaño de la fuente es mayor que la altura de la línea. Por lo tanto, es importante asegurarse de que tales conflictos no lo eran. Si usted está haciendo una pequeña altura de línea, respectivamente, reducir la fuente.

No se recomienda hacer demasiado poco texto y una pequeña distancia entre líneas. Dado que ninguno de los usuarios no será capaz de leer todo con calma. Él rápidamente los ojos cansados. Los motores de búsqueda también dicen que el texto es fácil de usar.

Por otra parte, en los últimos años hay un fuerte énfasis en la facilidad de uso para los usuarios móviles. Existen recomendaciones siempre han dicho que el tamaño de fuente debe ser normal, no es pequeña. Especialmente fuerte que afecta a la referencia. Con su pequeño tamaño, el usuario será difícil de utilizar la navegación del sitio.

En el buscador "Google" es una herramienta especial que ayuda en el análisis. Es muy conveniente para los webmasters.

Este es un ejemplo de los resultados que pueden ser.

Se recomienda el uso de estos consejos porque estos criterios afectan a los resultados de búsqueda.