Uvod u CSS oblikovanje teksta
Prethodnih dana ste bili ograničeni predstavljati tekst pomoću stare verzije CSS-a. Imali ste oznaku za promjenu sjenčenja i vrste teksta, međutim, mjerenje je ometano korištenjem unaprijed karakteriziranih dimenzija teksta. Različiti utjecaji poput intenziteta i probojnosti bili su zamislivi u samo temeljnim strukturama uz pomoć HTML oznaka. Trenutno se korisnik može poslužiti raznim svojstvima oblikovanja teksta CSS-a da bi rasporedio tekst na web stranicama na njegov način.
U ovom ćete poglavlju vidjeti brojna svojstva oblikovanja CSS teksta. CSS svojstva oblikovanja teksta koriste se za oblikovanje teksta, oblikovanje teksta, opisivanje nekoliko stilova oblikovanja itd. Svojstva pružaju vizualni prikaz znakova, razmaka, riječi, odlomaka i mnogih drugih.
Popis svojstava oblikovanja teksta CSS-a:
Pojedinosti načina oblikovanja teksta u CSS-u: -
1) Boja teksta
Ovo svojstvo može se koristiti za promjenu boje teksta. Može se definirati korištenjem svojstva boje.
Primjer : Ilustracija boje teksta
CSS Text Color Property
Pozdrav svijete….
Pozdrav do EDUCBA…
Prikazat će se sljedeći izlaz:
2) Usklađivanje teksta
Ovo svojstvo može se koristiti za promjenu horizontale teksta. Može se definirati korištenjem svojstava lijevo, desno, u sredini, opravdavanje.
Primjer : ilustracija poravnanja teksta
Text Alignment Property
Pozdrav svijete…
Dobrodošli u EDUCBA …
Obrazovni savjetnik …
Prikazat će se sljedeći izlaz:
3) Dekoracija teksta
Ovo se svojstvo može koristiti za ukrašavanje teksta. To se može definirati uporabom podvlačenja, podvlačenja, svojstava linija.
Primjer : Ilustracija ukrašavanja teksta
Text DecorationProperty
Pozdrav svijete…
Dobrodošli u EDUCBA …
Obrazovni savjetnik …
Prikazat će se sljedeći izlaz:
4) Transformacija teksta
Ovo se svojstvo može koristiti za promjenu velikih slova teksta. Može se definirati upotrebom velikih, malih i malih slova.
Primjer : Ilustracija transformacije teksta
Text Transformation Property
Pozdrav svijete…
Dobrodošli u educba …
Obrazovni savjetnik …
Prikazat će se sljedeći izlaz:
5) Uvlačenje teksta
Ovo svojstvo može se koristiti za uvlačenje prvog retka teksta. Može se definirati pomoću svojstava px, cm, pt.
Primjer : ilustracija uvlačenja teksta
Text Indentation Property
Pozdrav svijete…
Dobrodošli u Educba …
Obrazovni savjetnik …
Prikazat će se sljedeći izlaz:
6) Razmak riječi
Ovo se svojstvo može koristiti za prostor između riječi. Može se definirati korištenjem svojstva razmaka riječi.
Primjer : ilustracija razmaka riječi
Word Spacing Property
Pozdrav svijete…
Dobrodošli u Educba …
Obrazovni savjetnik …
Prikazat će se sljedeći izlaz:
7) Razmak slova
Ovo svojstvo može se koristiti za razmak između znakova. Može se definirati korištenjem svojstva razmaka slova.
Primjer : Ilustracija razmaka slova
Letter Spacing Property
Pozdrav svijete…
Dobrodošli u Educba …
Obrazovni savjetnik …
Prikazat će se sljedeći izlaz:
8) Visina crte
Ovo se svojstvo može upotrijebiti za razmak između linija. Može se definirati korištenjem svojstva visine crte.
Primjer : ilustracija visine crte
Line Height Property
h3
(
line-height:2.5;
)
h4
(
line-height:150%;
)
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) je a
vodeći svjetski pružatelj obrazovanja utemeljenog na vještinama
U eduCBA-i je nama ponosno napraviti posao orijentiran
pružiti tečajeve dostupne svima, bilo kada i bilo gdje.
Prikazat će se sljedeći izlaz:
9) Tekst-smjer
Ovo svojstvo može se koristiti za promjenu smjera teksta. Može se definirati pomoću rtl svojstva. Postavlja smjer s desna na lijevo.
Primjer : Ilustracija smjera teksta
Text Direction Property
Pozdrav svijetu … Dobrodošli u Educba …
Prikazat će se sljedeći izlaz:
10) teksta sjena
Ovo svojstvo može se koristiti za davanje sjene tekstu. To se može definirati korištenjem svojstva text-shadow. Koristi komponente kao što su položaj lijeve strane, gornji položaj, veličina zamućenja, naziv boje.
Primjer : Ilustracija sjene teksta
Text Shadow Property
h3
(
text-shadow:3px 3px 2px lightblue;
)
h4
(
text-shadow:3px 3px 2px plum;
)
Pozdrav svijetu … Dobrodošli u EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) je obrazovanje temeljeno na vještinama
Prikazat će se sljedeći izlaz:
11) Ems
Ovo je skalabilna jedinica za dimenzioniranje. Ovo svojstvo em može se koristiti za određivanje veličine teksta prema okolnom tekstu. Zadana veličina teksta je 1em, što je jednako 12pt. 2em je jednak 24pt i tako dalje.
Primjer : Ilustracija svojstva ems
Ems Property
h3
(
font-size: 0.8em;
)
h4
(
font-size: 1.2em;
)
Pozdrav svijetu … Dobrodošli u EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) je obrazovanje temeljeno na vještinama
Prikazat će se sljedeći izlaz:
12) Obitelj fontova
Ovo svojstvo koristi se za pružanje različitih vrsta imena fontova za odabrani tekst. Na primjer, Helvetica, Calibri, Arial, Sans-serif, Times, Courier New, itd.
Primjer : ilustracija svojstva porodice fontova
Font Family Property
Pozdrav svijete…
Dobrodošli u Educba …
Obrazovni savjetnik …
Prikazat će se sljedeći izlaz:
Zaključak
Do sada smo proučavali načine oblikovanja teksta u CSS-u. Možete vidjeti da je tekst predstavljen sa različitim vrstama svojstava oblikovanja teksta. Ova svojstva su vrlo važni aspekti CSS-a za prikaz teksta na web stranici kako bi korisnici ili čitatelji mogli privući pažnju svojim tekstom na web mjestu. Iskoristite ove značajke teksta vrlo jednostavno i učinkovito na web stranicama.
Preporučeni članci
Ovo je vodič za CSS oblikovanje teksta. Ovdje smo detaljno razgovarali o uvodu i popisu svojstava oblikovanja CSS teksta s primjerima primjera koda i pravilnim ispisom. Možete i proći naše druge predložene članke da biste saznali više -
- Što je CSS?
- SASS vs CSS
- CSS naredbe
- CSS3 pitanja za intervju