Sissejuhatus CSS-i teksti vormindamisse
Eelmistel päevadel pidite teid teksti esindama, kasutades CSS-i vana versiooni. Sisu varjutuse ja kirjatüübi muutmiseks oli teil silt, kuid mõõtmist takistas eelnevalt kirjeldatud teksti mõõtmete kasutamine. Erinevad mõjud, nagu intensiivsus ja läbikukkumine, olid HTML-siltide abil mõeldavad vaid põhistruktuurides. Praegu saab kasutaja veebilehtedel teksti omal moel korraldamiseks kasutada mitmesuguseid CSS-i teksti vormindamise atribuute.
Selles peatükis näete arvukalt CSS-i teksti vormindamise atribuute. CSS-i teksti vormindamise atribuute kasutatakse teksti kujundamiseks, teksti stiilimiseks, paari vormindamisstiili kirjeldamiseks jne. Atribuudid pakuvad märkide, tühikute, sõnade, lõikude ja palju muu visuaalset esitust.
CSS-i teksti vormindamise atribuutide loend:
Üksikasjad teksti vormindamise viiside kohta CSS-is: -
1) Teksti värv
Seda omadust saab kasutada teksti värvi muutmiseks. Seda saab määratleda värviomaduste abil.
Näide : teksti värvi illustratsioon
CSS Text Color Property
Tere, Maailm….
Tere tulemast EDUCBAsse …
See kuvab järgmise väljundi:
2) teksti joondamine
Seda omadust saab kasutada teksti horisontaali muutmiseks. Seda saab määratleda, kasutades vasakut, paremat, keset, õigustavat omadust.
Näide : teksti joondamise illustratsioon
Text Alignment Property
Tere, Maailm…
Tere tulemast EDUCBA …
Hariduskonsultant …
See kuvab järgmise väljundi:
3) teksti kaunistamine
Seda omadust saab kasutada teksti kaunistamiseks. Seda saab määratleda allajoonimise, ülajoone ja sirgjoonelise omaduse abil.
Näide : illustratsioon teksti kaunistamiseks
Text DecorationProperty
Tere, Maailm…
Tere tulemast EDUCBA …
Hariduskonsultant …
See kuvab järgmise väljundi:
4) teksti teisendamine
Seda omadust saab kasutada teksti juhtumite muutmiseks. Seda saab määratleda suurtähtede, suurtähtede ja väiketähtede abil.
Näide : teksti teisendamise illustratsioon
Text Transformation Property
Tere, Maailm…
Tere tulemast saidile …
Hariduskonsultant …
See kuvab järgmise väljundi:
5) Teksti treppimine
Seda omadust saab kasutada teksti esimese rea taandeks. Seda saab määratleda px, cm, pt atribuutide abil.
Näide : teksti taande illustratsioon
Text Indentation Property
Tere, Maailm…
Tere tulemast Educba …
Hariduskonsultant …
See kuvab järgmise väljundi:
6) sõnavahe
Seda omadust saab kasutada sõnade vahel ruumi jätmiseks. Seda saab määratleda sõna-tühiku omaduse abil.
Näide : sõnade vahe illustratsioon
Word Spacing Property
Tere, Maailm…
Tere tulemast Educba …
Hariduskonsultant …
See kuvab järgmise väljundi:
7) tähtede vahe
Seda omadust saab kasutada märkide vahel ruumi eraldamiseks. Seda saab määratleda tähtede vahekauguse omaduse abil.
Näide : illustratsioon tähtede vahekaugusest
Letter Spacing Property
Tere, Maailm…
Tere tulemast Educba …
Hariduskonsultant …
See kuvab järgmise väljundi:
8) Joone kõrgus
Seda omadust saab kasutada rea eraldamiseks. Seda saab määratleda joone kõrguse omaduse abil.
Näide : joone kõrguse illustratsioon
Line Height Property
h3
(
line-height:2.5;
)
h4
(
line-height:150%;
)
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) on a
juhtiv oskustepõhise hariduse pakkuja maailmas
EduCBA-s on töökohale orienteerumine meie uhkuse küsimus
kasutada kursusi, mis on kättesaadavad kõigile, igal ajal ja igal pool.
See kuvab järgmise väljundi:
9) teksti suund
Seda omadust saab kasutada teksti suuna muutmiseks. Seda saab määratleda rtl atribuudi abil. See määrab suuna paremalt vasakule.
Näide : teksti suuna illustratsioon
Text Direction Property
Tere maailm … Tere tulemast Educba …
See kuvab järgmise väljundi:
10) tekstivari
Seda omadust saab kasutada teksti varju andmiseks. Seda saab määratleda teksti varju omaduse abil. See kasutab selliseid komponente nagu vasak positsioon, ülemine asend, hägususe suurus, värvinimi.
Näide : illustratsioon teksti varjust
Text Shadow Property
h3
(
text-shadow:3px 3px 2px lightblue;
)
h4
(
text-shadow:3px 3px 2px plum;
)
Tere maailm … Tere tulemast EDUCBAsse …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) on oskuspõhine haridus
See kuvab järgmise väljundi:
11) Ems
See on skaleeritav mõõtühik. Seda em atribuuti saab kasutada teksti suuruse määratlemiseks vastavalt ümbritsevale tekstile. Teksti vaikesuurus on 1em, mis võrdub 12pt. 2em on võrdne 24pt ja nii edasi.
Näide : ems-i vara illustratsioon
Ems Property
h3
(
font-size: 0.8em;
)
h4
(
font-size: 1.2em;
)
Tere maailm … Tere tulemast EDUCBAsse …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) on oskuspõhine haridus
See kuvab järgmise väljundi:
12) Fondide perekond
Seda omadust kasutatakse valitud teksti eri tüüpi fontide perekonnanimede pakkumiseks. Näiteks Helvetica, Calibri, Arial, Sans-serif, Times, Courier New jne.
Näide : font-perekonna vara illustratsioon
Font Family Property
Tere, Maailm…
Tere tulemast Educba …
Hariduskonsultant …
See kuvab järgmise väljundi:
Järeldus
Siiani oleme uurinud CSS-is teksti vormindamise viise. Võite näha, et teksti esitatakse eri tüüpi teksti vormindamise atribuutidega. Need omadused on CSS-i väga olulised aspektid teksti kuvamiseks veebilehel, et kasutajad või lugejad saaksid teie veebisaidil teksti nähes meelitada. Kasutage neid tekstiomadusi veebilehtedel väga hõlpsalt ja tõhusalt.
Soovitatavad artiklid
See on olnud CSS-i teksti vormindamise juhend. Siin on üksikasjalikult arutatud CSS-i teksti vormindamise omaduste sissejuhatust ja loendit koos näidiskoodinäidete ja korraliku väljundiga. Lisateavet leiate ka meie muudest soovitatud artiklitest -
- Mis on CSS?
- SASS vs CSS
- CSS-i käsud
- CSS3 intervjuu küsimused