Ajustos en el CSS: interlineat

En CSS, la distància entre línies és molt fàcil de configurar. Per a aquesta fi hi ha una propietat especial. Però, és clar, hi ha molts altres paràmetres, que són universals i es poden aplicar al text.

Si es realitza cap ajust, que s'ajusten a valors per defecte. es pot canviar la distància si es desitja. El valor pot ser un percentatge o píxels.

Alt de fila

La distància entre les línies de CSS es pot demostrar mitjançant la següent figura.

A la imatge anterior mostra els paràmetres amb les distàncies corresponents. El text està en l'espai de mida de font. Recordeu que la línia de text no s'inicia a la base i lleugerament superior. L'espai proporcionat a continuació a les cartes que tenen elements de fons (G, I, i així successivament).

Recordeu que l'espai entre els blocs de mida de font es diu guiant. Amb HTML i CSS aquesta propietat no apareix, però és en els altres editors de text i gràfics. Per exemple, en Adobe Photoshop.

La figura anterior mostra en quina part del "Photoshop", podeu especificar que porta. I al costat determinat ajust de mida de font.

Exemples de l'ús de línia d'altura

En CSS, la distància entre les línies es pot ajustar per cent. Un exemple il·lustratiu és la següent.

En el cas de valors petits de l'usuari del seu lloc serà un inconvenient per a llegir.

La distància pot ser variada i la mida de la font. Si la diferència entre els paràmetres bàsics diferirà en gran mesura en nombre, la diferència es compensa per l'augment líder.

subtileses de disseny

La distància entre les línies de CSS pot personalitzar encara més diferents guions. Penseu l'exemple a la figura.

En el "element" en aquest cas serà el text. Farcit - farciment està dins de l'objecte, i el marge d'- la indentació de l'objecte. Border - aquest marc. Pot ser 0 píxels, i pot ser 100.

La següent imatge mostra immediatament tots els marges, el marc i l'altura d'una línia de text.

Si vostè té un petit text, tot en una sola línia, o cada línia en un paràgraf a part, la distància es pot ajustar entre els paràgrafs amb sangria. És a dir maring i el farcit entre les línies en una cel·la no tindrà cap efecte. Creen la sagnia només a les vores de l'objecte. Objecte - tot aquest paràgraf, en lloc de línies en ell. És important que no es confongui.

En els casos en què un gran nombre de files, tots els quals estan ubicats en el mateix objecte, es recomana el tipus de lletra per a canviar els paràmetres bàsics.

Com augmentar la distància entre les línies de CSS

La distància entre les línies de HTML, pot registrar a qualsevol classe o per a tots els paràgrafs en el text. Si s'especifica així: p {line-height: 20px; } - llavors absolutament tots els paràgrafs de la pàgina seran cadenes de 20 píxels. Si vols en diferents llocs en diferents mides, es recomana fer de la següent manera.

Prescrivim estils.

.class1 {line-height: 20px; }

.class2 {line-height: 16px; }

.class3 {line-height: 12px; }

Per a més claredat, s'afegeix un marc, pel que pot veure que funciona. En el futur, s'ha d'eliminar.

A continuació, fem servir aquestes classes. El resultat és el següent.

Recordeu que en el tercer cas, la banda es va dirigir al text. Tot a causa del fet que el mida de la font és més gran que l'altura de la línia. Per tant, és important assegurar-se que aquests conflictes no ho eren. Si vostè està fent una petita altura de línia, respectivament, reduir la font.

No es recomana fer massa poc text i una petita distància entre línies. Atès que cap dels usuaris no serà capaç de llegir tot amb calma. Ell ràpidament els ulls cansats. Els motors de cerca també diuen que el text és fàcil d'utilitzar.

D'altra banda, en els últims anys hi ha un fort èmfasi en la facilitat d'ús per als usuaris mòbils. Hi recomanacions sempre han dit que la mida de font ha de ser normal, no és petita. Especialment forta que afecta la referència. Amb la seva petita grandària, l'usuari serà difícil d'utilitzar la navegació del lloc.

Al cercador "Google" és una eina especial que ajuda en l'anàlisi. És molt convenient per als administradors web.

Aquest és un exemple dels resultats que poden ser.

Es recomana l'ús d'aquests consells perquè aquests criteris afecten els resultats de cerca.