Introduktion til CSS-tekstformatering
I de foregående dage blev du tvunget til at repræsentere teksten ved hjælp af den gamle version af CSS. Du havde tag for at ændre skyggen og skrifttypen for indholdet, men måling blev hindret ved at bruge de forud karakteriserede tekstdimensioner. De forskellige påvirkninger som intensitet og gennembrud kunne tænkes i bare grundlæggende strukturer ved hjælp af HTML-mærker. For tiden kan brugeren bruge en række CSS-tekstformateringsegenskaber til at arrangere teksten på websiderne på hans måder.
I dette kapitel ser du adskillige CSS-tekstformateringsegenskaber. CSS-tekstformateringsegenskaber bruges til at designe teksten, style teksten, beskrive et par formateringsformater osv. Egenskaberne giver dig den visuelle repræsentation af tegn, mellemrum, ord, afsnit og mange flere.
Liste over CSS-tekstformateringsegenskaber:
Detaljer om tekstformateringsmåder i CSS: -
1) Tekstfarve
Denne egenskab kan bruges til at ændre farven på teksten. Det kan defineres ved hjælp af farveegenskaber.
Eksempel : Illustration af tekstfarve
CSS Text Color Property
Hej Verden….
Velkommen til EDUCBA …
Det viser følgende output:
2) Tekstjustering
Denne egenskab kan bruges til at ændre tekstens vandrette retning. Det kan defineres ved hjælp af venstre, højre, center, retfærdiggøre egenskaber.
Eksempel : Illustration af tekstjustering
Text Alignment Property
Hej Verden…
Velkommen til EDUCBA …
Uddannelseskonsulent …
Det viser følgende output:
3) Tekstdekoration
Denne egenskab kan bruges til at dekorere teksten. Det kan defineres ved hjælp af understregnings-, overstregnings-, linjegennemseegenskaber.
Eksempel : Illustration af tekstdekoration
Text DecorationProperty
Hej Verden…
Velkommen til EDUCBA …
Uddannelseskonsulent …
Det viser følgende output:
4) Teksttransformation
Denne egenskab kan bruges til at ændre tekster på teksten. Det kan defineres ved brug af store bogstaver, store bogstaver, egenskaber.
Eksempel : Illustration af teksttransformation
Text Transformation Property
Hej Verden…
Velkommen til educba …
Uddannelseskonsulent …
Det viser følgende output:
5) Tekstindrykning
Denne egenskab kan bruges til at indrykke den første linje i teksten. Det kan defineres ved hjælp af egenskaber px, cm, pt.
Eksempel : Illustration af tekstindrykket
Text Indentation Property
Hej Verden…
Velkommen til Educba …
Uddannelseskonsulent …
Det viser følgende output:
6) Ordafstand
Denne egenskab kan bruges til at give mellemrum mellem ord. Det kan defineres ved hjælp af ord-afstand-egenskaben.
Eksempel : Illustration af ordafstand
Word Spacing Property
Hej Verden…
Velkommen til Educba …
Uddannelseskonsulent …
Det viser følgende output:
7) Brevafstand
Denne egenskab kan bruges til at give mellemrum mellem tegn. Det kan defineres ved hjælp af egenskaben for bogstavafstand.
Eksempel : Illustration af brevafstand
Letter Spacing Property
Hej Verden…
Velkommen til Educba …
Uddannelseskonsulent …
Det viser følgende output:
8) Liniehøjde
Denne egenskab kan bruges til at give plads mellem linjerne. Det kan defineres ved hjælp af liniehøjdeegenskab.
Eksempel : Illustration af linjehøjde
Line Height Property
h3
(
line-height:2.5;
)
h4
(
line-height:150%;
)
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) er en
førende global udbyder af kvalitetsbaseret uddannelse
Hos eduCBA er det et spørgsmål om stolthed for os at gøre joborienteret
holder kurser tilgængelige for enhver, når som helst og hvor som helst.
Det viser følgende output:
9) Tekst-retningen
Denne egenskab kan bruges til at ændre retningen på teksten. Det kan defineres ved hjælp af rtl egenskab. Den indstiller retning fra højre til venstre.
Eksempel : Illustration af tekstretning
Text Direction Property
Hej Verden … Velkommen til Educba …
Det viser følgende output:
10) Tekst-shadow
Denne egenskab kan bruges til at give skygge for teksten. Det kan defineres ved hjælp af egenskaben tekst-skygge. Den bruger komponenter som venstre position, den øverste position, slørets størrelse, farvenavn.
Eksempel : Illustration af tekstskygge
Text Shadow Property
h3
(
text-shadow:3px 3px 2px lightblue;
)
h4
(
text-shadow:3px 3px 2px plum;
)
Hej verden … Velkommen til EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) er en færdighedsbaseret uddannelse
Det viser følgende output:
11) Ems
Dette er en skalerbar enhed til størrelse. Denne em egenskab kan bruges til at definere størrelsen på teksten i henhold til den omgivende tekst. Tekstens standardstørrelse er 1 em, hvilket er lig med 12pt. 2em er lig med 24pt osv.
Eksempel : Illustration af ems egenskab
Ems Property
h3
(
font-size: 0.8em;
)
h4
(
font-size: 1.2em;
)
Hej verden … Velkommen til EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) er en færdighedsbaseret uddannelse
Det viser følgende output:
12) Skrifttype
Denne egenskab bruges til at give forskellige typer fontfamilienavne til den valgte tekst. F.eks. Helvetica, Calibri, Arial, Sans-serif, Times, Courier New osv.
Eksempel : Illustration af font-familieejendommen
Font Family Property
Hej Verden…
Velkommen til Educba …
Uddannelseskonsulent …
Det viser følgende output:
Konklusion
Indtil videre har vi undersøgt om tekstformateringsmåder i CSS. Du kunne se teksten præsenteres med forskellige typer tekstformateringsegenskaber. Disse egenskaber er meget vigtige aspekter af CSS for at få vist teksten på websiden, så brugere eller læsere kan få tiltrækning ved at se din tekst på webstedet. Brug disse tekstegenskaber meget let og effektivt på websiderne.
Anbefalede artikler
Dette har været en guide til CSS-tekstformatering. Her har vi drøftet en introduktion og en liste over CSS-tekstformateringsegenskaber i detaljer med eksempler på eksempler på kode og korrekt output. Du kan også gennemgå vores andre foreslåede artikler for at lære mere -
- Hvad er CSS?
- SASS vs CSS
- CSS-kommandoer
- CSS3 Interview Spørgsmål