Mens vi skriver en artikkel eller et dokument, trenger vi ofte noen tegn for å være i spesifikke tilfeller. På en webside brukes HTML -elementet hvis tekst krever å bli transformert med CSS -egenskapen "Teksttransform”. Denne egenskapen sparer også tid på en slik måte at etter å ha lagt til alle karakterene, kan saken deres transformeres på en gang.

Dette innlegget vil lære deg hvordan vi kan endre tekstsaker med CSS. Så la oss starte!

Hvordan store og små bokstaver ved hjelp av CSS?

I CSS, “Teksttransform”Eiendom kontrollerer kapitaliseringen av teksten. Det brukes også til å konvertere tekst til store eller små bokstaver.

Teksttransform eiendomsverdier

De mulige verdiene for CSS-tekst-transform-egenskapen er listet opp nedenfor:

• • “stor bokstav”: Denne verdien gjør at alle tegn i elementets tekst er kapitalisert.
  • “små bokstaver”: Denne verdien endrer elementets tekst til små bokstaver.
  • “kapitalisere”: Denne verdien endrer hvert ords første bokstav kapitalisert.
  • “ingen”: Denne verdien begrenser elementets tekst for modifisering.
  • “første”: Denne verdien angir standardverdien.
  • “arve”: Denne verdien setter verdien fra foreldrenes element.

Analyser eksemplet nedenfor!

Eksempel: Transformerer tekst til store og små bokstaver

Legg først til et divelement med klassenavnet "eske”. Inne i kroppen, legg til tre overskriftskoder

,

, og

, hvor teksten til

overskrift er alt i store bokstaver,

er i små bokstaver, og den tredje er også i små bokstaver.

Nedenfor er HTML -koden:

Smoks: Velkommen til Linuxhint

Overcase: Velkommen til Linuxhint

Kapitaliser: Velkommen til Linuxhint

Style Box Div

.Boks
Høyde: 200px;
Bredde: 80%;
Border: 4px Solid #E4CFCF;
Bakgrunnsfarge: CadetBlue;
Margin: 1px auto;
polstring: 10px;

Div opprettet i ovennevnte HTML -fil er nå stylet med CSS -egenskaper som er forklart nedenfor:

• • “høyde”Brukes for å sette høyden på DIV.
  • “bredde”Brukes for å sette bredden på div.
  • “grense”Eiendom brukes til å påføre grensen rundt elementet, som er 4px bredde, solid linjetype og #e4cfcf farge.
  • “bakgrunnsfarge”Angir elementets bakgrunnsfarge.
  • “margin”Eiendom justerer plass på alle sider av elementet.
  • “polstring”Eiendom brukes til å produsere plass rundt innholdet i DIV -elementet eller inne i elementets grense.

Kodeblokkene nedenfor indikerer at alle overskriftselementene er stylet med forskjellige verdier av tekst-transformasjonsegenskapene. De

Element brukes med eiendomsteksttransform med verdien som "små bokstaver”:

H1
Teksttransform: små bokstaver;

De

Element brukes med den teksttransformede egenskapen med verdien som "stor bokstav”:

H2
Teksttransform: store bokstaver;

Til

element, verdien av den tekst-transformasjonsegenskapen er satt som “kapitalisere”:

H3
Teksttransform: Kapitalisere;

Ved å tilby den ovennevnte koden, blir teksten til den første overskriften omgjort til små bokstaver og den andre overskriften til store bokstaver. Mens den første bokstaven i hvert ord er kapitalisert i den tredje overskriften:

Flott! Vi har vellykket lært hvordan vi kan transformere teksten til store bokstaver, små bokstaver og alle kapitaliserte.

Konklusjon

Teksttransformegenskapen til CSS kontrollerer kapitaliseringen av teksten og brukes til å endre tilfellene av dokumentets tekst. Denne egenskapen gjelder alle elementer, der verdiene til denne egenskapen kan være store bokstaver, små bokstaver eller ingen. Denne bloggen har forklart prosedyren for å konvertere tekst til store og små bokstaver ved hjelp av CSS Text-Transform-egenskapen.