CSS-i seadistused: ridade vaheline kaugus

CSS-ist on ridade vaheline kaugus väga lihtne. Selle jaoks on selleks eriline vara. Kuid loomulikult on palju teisi parameetreid, mis on universaalsed ja neid saab teksti suhtes rakendada.

Kui te midagi ei tee, määratakse vaikimisi väärtused. Kui soovite, võite seda vahemaad muuta. Väärtus võib olla kas protsentides või pikslites.

Rida kõrgus

CSS-ist võib joonte vahekaugust näidata järgmiselt.

Eespool toodud pilt näitab parameetreid vastavate vahemaadega. Tekst asub fondi suurusega ruumis. Pange tähele, et teksti rida ei alustu alt, vaid on veidi suurem. Allpool asuvas ruumis on kirjad, millel on elemendid altpoolt (g, y jne).

Pange tähele, et fondi suurusega plokkide vahel on nimeks juhtiv. HTML-i ja CSS-i puhul ei kuvata seda omadust mingil viisil, kuid see on ka teistes graafilistes ja tekst-toimetajates. Näiteks Adobe Photoshopis.

Eespool toodud joonisel on näha, kus Photoshopis saate määrata juhtpositsiooni. Number näitab font-size parameetrit.

Joone kõrgustiku näited

CSS-ist võib ridade vahekaugust määrata protsentides. Illustreeriv näide on toodud allpool.

Väikese väärtuse puhul on teie saidi kasutaja lugemiseks ebamugav.

Vahemaa saab muuta ja fondi suurust. Kui põhiparameetrite erinevus on arvudes väga erinev, siis kompenseerib seda erinevust juhtimise kasvu.

Disaini nõtkus

CSS-ist võib ridade vahekaugust täiendavalt kohandada erinevate taandudega. Vaatame näites joonisel.

Väli "Element", meie juhul on tekst. Padding on objekti sees olev taane ja marginaal on objekti taandumine. Piir on raam. See võib olla 0 pikslit ja võib-olla 100.

Järgmine pilt näitab korraga kõiki teksti rea taaneid, raami ja kõrgust.

Kui teil on väike tekst, kõik ühes reas või igas reas eraldi lõigus, siis saab distantsi muuta nende lõigete vahele. See tähendab, et ühest elemendist koosnevate joonte sisestamine ja lisamine ei mõjuta. Nad panevad vaid objekti servad taha. Objekt on terve lõik, mitte üks joon. On oluline, et siin ei tekiks segadust.

Juhul, kui on palju ridu ja kõik see asub ühes objektis, on fonti soovitav peamiste parameetritega muuta.

Kuidas suurendada CSS-liinide vahekaugust

Joonte vaheline kaugus HTML-i vahel võib olla määratud klassi või kõikide teksti punktidega. Kui määrate selle: p {line-height: 20px; }, Siis on absoluutselt kõigil lehel olevatel joontel 20 pikslit. Kui teil on erinevates kohtades erinevad suurused, soovitame teha järgmist.

Kirjutades stiile.

.class1 {line-height: 20px; }

. Klass 2 {line-height: 16px; }

. Klass 3 {line-height: 12px; }

Selguse huvides lisame raami, et saaksite näha, kas see töötab. Tulevikus tuleb see eemaldada.

Seejärel rakendage neid klasse. Tulemus on järgmine.

Pange tähele, et kolmandal juhul tabas bänd teksti. Kõik sellepärast, et fondi suurus on rea kõrgusest suurem. Seepärast on oluline tagada, et selliseid vastuolusid ei oleks. Kui teete väikese rida, siis vähendage vastavat fonti.

Ei ole soovitatav teha liiga vähe teksti ja väikseid vahemaid joonte vahel. Kuna ükski kasutaja ei saa seda kõike seda vaikselt lugeda. Tema silmad kasvavad kiiresti väsinud. Otsingumootorid ütlevad ka, et tekst on kasutajasõbralik.

Veelgi enam, viimasel ajal on suurt rõhku mobiilikasutajate mugavusele. Seal soovitatakse alati, et fondi suurus peaks olema normaalne, mitte väike. See mõjutab lingid eriti tugevalt. Väikese suurusega kasutajatel on saidi navigeerimise kasutamisel raskusi.

Otsingumootoril "Google" on spetsiaalne tööriist, mis aitab seda analüüsi. See on väga sobiv veebimeistrite jaoks.

Siin on näide tulemustest, mis võivad olla.

Soovitatav on kasutada nende vihjeid, kuna need kriteeriumid mõjutavad otsingutulemust.