Com establir un text justificat amb CSS

Ús de la propietat Alinear text de CSS per justificar el text

Una de les propietats de la tipografia d'un lloc web que podeu optar per ajustar durant el desenvolupament d'un lloc és com es justifica el text del lloc. Per defecte, el text del lloc web queda justificat i aquesta és la quantitat de llocs que deixen el text. Les úniques altres opcions estan justificades per raons justificades, que ningú utilitza als llocs web, ja que provocaria que el text sigui essencialment impossible de llegir en línia, o el que es coneix com plenament justificat.

El text justificat és un bloc de text que s'alinea tant a la part esquerra com a la dreta, a diferència d'un d'aquests costats (que és el que fan les justificacions "sortides" i "correctes"). L'efecte doblement justificat s'aconsegueix ajustant els espais de paraula i lletra a cada línia de text per garantir que cada línia sigui la mateixa. Aquest efecte es diu justificació completa . Justifica el text a CSS mitjançant la propietat Alinear text .

Com funciona la justificació?

La raó per la qual sovint veieu una vora desigual al costat dret d'un bloc de text és perquè cada línia de text no té la mateixa longitud. Algunes línies tenen més paraules o paraules més llargues mentre que altres tenen paraules menys o més curtes. Per justificar aquest bloc de text, cal afegir espais addicionals a algunes línies fins i tot per a totes les línies i fer-les coherents.

Cada creador de navegador web té el seu propi algorisme per aplicar els espais addicionals dins d'una línia. Els navegadors examinen la longitud de la paraula, la separació de paraules i altres factors per determinar on col·locar els espais.

Com a resultat, el text justificat pot no ser idèntic d'un navegador a un altre. Està bé ja que cap visitant del lloc saltarà d'un navegador a un altre només per comparar com es veuen les longituds de la línia del vostre lloc. Tanmateix, segur que la compatibilitat principal del navegador és bona per justificar el text amb CSS.

Com justificar el text

La justificació del text amb CSS requereix una secció de text per justificar.

Normalment, això es fa als paràgrafs del text ja que grans blocs de context de text que abasten múltiples línies estaran marcats amb etiquetes de paràgraf.

Després de tenir un bloc de text per justificar, només és qüestió d'establir l'estil justificat amb la propietat d' estil de text de text de CSS.

text align: justify;

Hauríeu d'aplicar aquesta regla CSS a un selector adequat per tal que el bloc de text es representi com es vol.

Quan es justifica el text

Molta gent té l'aparença de text justificat des del punt de vista del disseny, principalment perquè crea un aspecte molt consistent i mesurat, però hi ha desavantatges per justificar el text en una pàgina web.

En primer lloc, el text justificat pot ser difícil de llegir. Això és degut a que quan justifica el text, de vegades es pot afegir molt espai addicional entre algunes paraules de la línia. Aquests buits incompatibles poden fer que el text sigui més difícil de llegir. Això és especialment important a les pàgines web, que poden ser difícils de llegir ja a causa de la il·luminació, la resolució o la qualitat del maquinari. L'addició d'espais inusuals al text pot fer una situació encara pitjor.

A més dels problemes de lectura, els espais en blanc a vegades es relacionen entre si per crear "rius" d'espai en blanc al mig del text.

Aquestes grans llacunes d'espai en blanc poden provocar una visualització incòmoda. A més, en línies extremadament curtes, la justificació pot causar línies que contenen una paraula amb espais addicionals entre les mateixes lletres.

Per tant, quan hauria d'utilitzar la justificació del text? El millor moment per justificar el text es produeix quan les línies són llargues i la mida de la lletra és petita (cosa que és difícil de garantir en llocs web responsables en què la longitud de les línies canvia en funció de les mides de la pantalla). No hi ha cap nombre ràpid i ràpid per a la longitud de la línia o la mida del text; heu d'utilitzar el vostre millor criteri.

Després d'aplicar l'estil de text alinear per justificar el text, proveu-lo per assegurar-vos que el text no tingui rius d'espai en blanc, i assegureu-vos de provar-lo en diverses mides.

La forma més senzilla de fer-ho és veure-la amb ulls tocs. Els rius es destaquen com taques de blanc en un altre bloc de text de color gris. Si veieu els rius, heu de fer canvis a la mida del text o a l'amplada del bloc de text per desfer-se d'aquests rius desagradables.

Només utilitzeu la justificació després d'haver-la comparat amb el text de l'alineat a l'esquerra com es veu en aquest article. Fas com la coherència de la justificació completa, però el text justificat a l'esquerra sol ser més llegible. Al final, haureu de justificar el text perquè heu decidit justificar el text amb finalitats de disseny i ha confirmat que el vostre lloc continua sent fàcil de llegir.