Tekstas yra centrinis elementas svetainių kūrime, o jo orientacija yra svarbi vizualiniam bendram vaizdui tavo svetainėje. Nesvarbu, ar tu įgyvendini paprastą projektą, ar dirbi su sudėtinga web programa, tinkama orientacija gali pagerinti tavo dizainą. Šis vadovas suteiks tau pagrindus teksto orientacijos naudojimui su CSS ir parodys, kaip efektyviai išdėstyti tekstus.
Svarbiausi pastebėjimai
- Teksto orientacija gali būti valdoma naudojant CSS savybę text-align.
- Pagal numatymą daugelyje naršyklių teksto orientacija yra „kairė“.
- Orientaciją galima pakeisti į „dešinę“, „centrą“ arba „justifikuotą“.
- Orientacija taip pat veikia teksto išdėstymą ir skaitymo srautą.
Žingsnis po žingsnio instrukcija
1. Tekstas kairėje pusėje
Norėdami išbandyti numatytąją orientaciją, pirmiausia pridėsime teksto bloką, kurio orientacija nustatyta į „kairę“. Ši funkcija pasiekiama naudojant CSS savybę text-align: left;. Tai yra dažniausiai pasitaikanti teksto orientacija ir atitinka daugumos vakarų rašymo sistemų elgesį.
2. Tekstas centruojamas
Norėdami centruruoti tekstą, pakeisime CSS taisyklę į text-align: center;. Ši orientacija dažnai naudojama norint išryškinti antraštes ar specialias teksto dalis. Visas tekstas lygiai pasiskirsto centre, kas dažnai būna efektyvu estetiniais tikslais.
3. Tekstas dešinėje pusėje
Naudodami CSS taisyklę text-align: right; galite pasiekti, kad tekstas būtų išdėstytas dešinėje. Ši technika gali būti naudinga specialiems išdėstymams ar dizaino gairėms ir dažnai naudojama dvikalbių svetainėse, kurios yra skaitomos iš dešinės į kairę, pavyzdžiui, arabų kalboje.
4. Naudoti blokinį suskaidymą
Blokinis suskaidymas, kai tekstas tolygiai pasiskirsto per visą plotį, taip pat gali būti sukurtas naudojant CSS. Tai vyksta naudojant savybę text-align: justify;. Šio tipo orientacija užtikrina, kad tekstas atrodytų tvarkingas, tačiau tam tikrais atvejais gali sukelti neprašytas spragas tarp eilučių.
Santrauka – Teksto orientacijos pagrindai naudojant CSS
Šiame vadove sužinojote, kaip galite išdėstyti tekstus savo interneto projektuose naudojant CSS. Numatytoji orientacija yra „kairė“, tačiau su paprastais pakeitimais galite centruruoti tekstą, išdėstyti jį dešinėje pusėje ar pateikti blokiniame suskaidyme. Šios įgūdžiai yra svarbūs norint, kad jūsų svetainės būtų patrauklios ir patogios vartotojams.
Dažnai užduodami klausimai
Kaip galiu tinkamai išdėstyti tekstą keliomis kalbomis?Galite naudoti CSS savybę direction, kad formatizuotumėte tekstą RTL kalboms.
Koks skirtumas tarp text-align ir float?text-align valdo turinio orientaciją elemento viduje, o float įrenginius nuveda ir pašalina iš normalaus dokumento srauto.
Ar galiu pakeisti teksto orientaciją priklausomai nuo ekranų dydžio?Taip, galite naudoti media queries CSS, kad apibrėžtumėte skirtingus išdėstymus ar orientacijas įvairiems ekranų dydžiams.
