Kuinka asettaa perusteltu teksti CSS: llä

click fraud protection

Yksi verkkosivuston typografian ominaisuuksista, jota voit muokata sivuston kehityksen aikana, on se, miten sivuston teksti on perusteltu. Oletusarvoisesti verkkosivustoteksti jätetään perustelluksi, ja tämä on kuinka monta sivustoa jättää tekstinsä. Ainoat muut vaihtoehdot ovat oikein perusteltuja, mikä on harvinaista tai täysin perusteltua.

Perusteltu teksti on tekstilohko, joka kohdistuu sekä vasemmalle että oikealle puolelle, toisin kuin vain yksi näistä puolista (mitä "vasen" ja "oikea" perustelut tekevät). Kaksinkertaisesti perusteltu vaikutus saavutetaan säätämällä sanojen ja kirjainten väliä jokaisella tekstirivillä sen varmistamiseksi, että kukin rivi on saman pituinen. Tätä vaikutusta kutsutaan täydellinen perustelu. Perustele teksti CSS: ssä käyttämällä tekstin tasaus omaisuus.

Kuinka perustelu toimii?

Syy siihen, että näet usein epätasaisen reunan tekstilohkon oikealla puolella, on se, että jokainen tekstirivi ei ole samanpituinen. Joillakin riveillä on enemmän sanoja tai pidempiä sanoja, kun taas toisilla on vähemmän tai lyhyempiä sanoja. Tekstilohkon perustelemiseksi joillekin riveille on lisättävä ylimääräisiä välilyöntejä, jotta kaikki rivit tasoittuvat ja ne ovat yhtenäisiä.

instagram viewer

Jokaisella verkkoselaimella on oma algoritmi ylimääräisten välilyöntien käyttämiseen rivillä. Selaimet tarkastelevat sanojen pituutta, tavutusta ja muita tekijöitä määritellessään välilyönnit. Tämän seurauksena perusteltu teksti ei välttämättä näytä samanlaiselta selaimelta toiselle. Voit kuitenkin olla varma, että suuri selaintuki tukee tekstin perustelemista CSS: llä.

Kuinka perustella tekstiä

Tekstin perusteleminen CSS: llä edellyttää tekstiosan perustelemista. Tyypillisesti käytät tekstikappaleita, koska suuret, useita rivejä kattavat tekstikontekstilohkot merkitään kappaletageilla.

Kun sinulla on tekstilohko perusteltavaksi, sinun tarvitsee vain asettaa tyyli oikeutetuksi CSS-tekstin tasaustyyli -ominaisuudella. Käytä tätä CSS-sääntöä sopivaan valitsimeen, jotta tekstilohko renderoidaan tarkoitetulla tavalla.

Milloin perustella teksti

Monet ihmiset pitävät perustellun tekstin ulkoasusta suunnittelun näkökulmasta lähinnä siksi, että se luo hyvin yhdenmukaisen, mitatun ilmeen, mutta verkkosivun tekstin täydelliseen perusteluun on haittoja.

Ensinnäkin perusteltu teksti voi olla vaikea lukea. Tämä johtuu siitä, että kun perustelet tekstiä, rivin joidenkin sanojen väliin voidaan joskus lisätä paljon ylimääräistä tilaa. Nämä epäjohdonmukaiset aukot voivat vaikeuttaa tekstin lukemista. Tämä on erityisen tärkeää verkkosivuilla, joita voi olla vaikea lukea jo valaistuksen, resoluution tai muun laitteiston laadun vuoksi. Epätavallisten välilyöntien lisääminen tekstiin voi pahentaa tilannetta entisestään.

Luettavuushaasteiden lisäksi tyhjät tilat ovat toisinaan linjassa toistensa kanssa luomaan "jokia" valkoista tilaa tekstin keskelle. Nämä suuret tyhjät aukot voivat todella tehdä hankalan näytön. Lisäksi erittäin lyhyillä viivoilla perustelu voi aiheuttaa yhden sanan sisältäville riveille ylimääräisiä välilyöntejä itse kirjainten välissä.

Joten milloin sinun pitäisi käyttää tekstin perusteluja? Paras aika tekstin perustelemiseen tapahtuu, kun viivat ovat pitkiä ja fonttikoko pieni - jotain, jota on vaikea varmistaa reagoivilla verkkosivustoilla, joissa rivin pituus muuttuu näytön koon mukaan. Rivin pituudelle tai tekstin koolle ei ole kovaa ja nopeaa numeroa; sinun on käytettävä parasta harkintasi.

Kun olet käyttänyt tekstin tasaustyyliä tekstin perustelemiseksi, testaa se varmistaaksesi, että tekstissä ei ole tyhjää tilaa - ja testaa sitä erikokoisina. Helpoin testi ei vaadi mitään monimutkaisempaa kuin omat silmäsi. Joet erottuvat valkoisina täplinä muuten harmaassa tekstilohkossa. Jos näet jokia, sinun tulee tehdä muutoksia tekstin kokoon tai tekstilohkon leveyteen tekstin palauttamiseksi.

Käytä perusteluja vasta sen jälkeen, kun olet vertaillut sitä vasemmalle tasattuun tekstiin. Saatat pitää täydellisen perustelun johdonmukaisuudesta, mutta vasemmanpuoleisesti perusteltu vakioteksti on yleensä luettavampi. Loppujen lopuksi sinun tulisi perustella teksti, koska olet päättänyt perustella tekstin suunnittelutarkoituksiin ja olet vahvistanut, että sivustosi on edelleen helppo lukea.

instagram story viewer