Teksttransform eiendom i CSS

Tekst er en av de mest betydningsfulle delene av en hvilken som helst webside. Hver nettsted har tekst i begge skjemaene i.e. det kan være et avsnitt, overskrifter osv. Derfor gir CSS et bredt spekter av tekstegenskaper for styling og formatering av teksten som tekst-align, tekstfarge, tekst-transform, etc.

Alle disse egenskapene utfører forskjellige funksjoner, for eksempel, tekst-align bestemmer justeringen av tekst i.e. sentrum, høyre, venstre osv. Egenskapen for tekstfarget setter fargen på tekst i.e. rød, grønn osv., og så videre. Imidlertid vil denne oppskrivningen fokusere på egenskapen til tekst-transform.

Denne oppskrivningen presenterer en detaljert oversikt over egenskapen til teksttransform sammen med noen eksempler.

Teksttransform eiendom

En mest brukt CSS -egenskap som bestemmer utseendet til tekst i form av tekst case i.e. om teksten vil være i små bokstaver eller store bokstaver. Dessuten kan det også brukes til å kapitalisere den første karakteren til hvert ord.

Arbeidet med følgende verdier vil bli diskutert i denne artikkelen ved hjelp av eksempler:

• stor bokstav: Konverterer alle tekstenes tegn til store bokstaver.
• små bokstaver: Konverterer alle tekstenes tegn til små bokstaver.
• kapitalisere: Konverterer den første karakteren til hvert ord til en stor bokstav.
• ingen: Det viser standardoppførselen til den tekst-transformiske egenskapen i.e. Teksten vises på samme måte som den er skrevet.

Hvordan du bruker store bokstaver for tekst-transform eiendom

Den store verdien transformerer alle tegnene i store bokstaver

Eksempel
I dette eksemplet er teksten en blanding av både store bokstaver og små bokstaver. Imidlertid vil tildeling av store bokstaver til den store egenskapen til den store bokstaven transformere hver eneste bokstav til store bokstaver:

Html

Teksttransformasjonseiendom

Dette er første avsnitt

Dette er andre avsnitt

Dette er tredje avsnitt

CSS

Vi får følgende utdata:

Hvert brev blir omgjort til den store bokstaven.

Hvordan bruke småverdi for egenskap for teksttransform

Det vil konvertere hvert eneste tegn på teksten til små bokstaver.

Eksempel

I den undergitte koden er første bokstav i hvert ord en store bokstav, men tildeling av småverdi til den teksttransformede egenskapen vil forvandle all teksten til små bokstaver:

Html

Teksttransformasjonseiendom

Dette er første avsnitt

Dette er andre avsnitt

Dette er tredje avsnitt

CSS

Over kode genererer følgende utgang:

Hvert brev blir forvandlet til den små bokstaven.

Hvordan du bruker kapitaliseringsverdien for tekst-transformasjonseiendom

Som navnet i seg selv antyder, kapitaliserte det den første bokstaven i hvert ord. Eksemplet nedenfor vil vise arbeidet med kapitalisert verdi.

Eksempel

I skriptet nedenfor er hver bokstav i dokumentet i små bokstaver, og kapitaisverdien brukes til H2 -elementet, så det vil konvertere den første bokstaven i hvert ord til kapital:

Html

Teksttransformasjonseiendom

Dette er første avsnitt

Dette er andre avsnitt

Dette er tredje avsnitt

CSS

Ovennevnte kode genererer følgende utgang:

Første bokstav i hvert ord blir forvandlet til store bokstaver.

Hvordan du bruker ingen verdi for tekst-transformasjonseiendom

De ingen Verdien forhindrer all teksten fra teksttransformasjon i.e. det gjengir alle karakterene som den er. Eksemplet nedenfor lar deg forstå hvordan du bruker "ingen”Verdi for egenskapen til teksttransform.

Eksempel

Følgende stykke kode implementerer egenskapen til teksttransform på et P, H2-element:

Html

Teksttransformasjonseiendom

Dette er første avsnitt

Dette er andre avsnitt

Dette er tredje avsnitt

CSS

Ovennevnte kode ville ikke endre tekstutseendet:

All teksten forblir uendret.

Konklusjon

CSS gir teksttransformegenskap for å kontrollere teksttransformasjonen i.e. Lekende og store bokstaver konverterer alle bokstavene til henholdsvis små og store bokstaver, og ingen verdi gjengir teksten i standardfeltet. Eiendeleregenskapen gjør det første karakteren til hvert ord til store bokstaver.

Denne oppskrivningen forklarer hvordan du bruker den tekst-transformerte egenskapen. Hva er verdiene som kan brukes til egenskapen til tekst-transformering, og hvordan påvirker disse verdiene utseendet til teksten?