Kuinka käyttää CSS:ää isojen kirjainten muuntamiseen otsikon kirjainkoon?

Kuinka Kayttaa Css Aa Isojen Kirjainten Muuntamiseen Otsikon Kirjainkoon



' isot kirjaimet ', koska sen nimi asettaa kohdetekstin kaikki merkit isoihin kirjaimiin ja ' otsikon tapaus ” kirjoittaa kohdetekstin jokaisen sanan alkukirjaimen isolla kirjaimella. Sitä käytetään enimmäkseen otsikoiden, alaotsikoiden ja otsikoiden muotoiluun verkkosivuilla. Käyttäjiä voidaan myös käyttää parantamaan valikkokohtien tai tuoteluetteloiden luettavuutta. Se parantaa myös verkkosivun yleisilmettä ja tunnettuutta.

Tämä artikkeli esittelee vaiheittaisen prosessin isojen kirjainten muuntamiseksi otsikon kirjainkoon.

Kuinka muuntaa isot tekstit otsikon kirjaimiin?

CSS-ominaisuuksien ja JavaScriptin avulla isoilla kirjaimilla oleva teksti voidaan muuntaa otsikon kirjainkoon. Tämä muunnos auttaa parantamaan tekstin luettavuutta ja ulkonäköä. Lisäksi se tarjoaa yhtenäisen muotoilun ja parantaa käyttökokemusta.







Noudata alla olevia vaiheittaisia ​​ohjeita muuttaaksesi isot kirjaimet otsikon kirjaimiin:



Vaihe 1: Luo kohdistettu elementti
Luo tässä ensimmäisessä vaiheessa kohdistettu/valittu elementti ' ' -tunniste, joka muunnetaan otsikon kirjainkoon. Esimerkiksi ' s ”elementtien data on kohdistettu:



< keskusta >
< s id = 'muunnin' > TÄMÄ TEKSTI MUUNNETAAN ISOJISTA KIRJOITUKSISTA OTSIKKO-KOKOON KÄYTTÖÖN CSS:n avulla < / s >
< keskusta >

Yllä olevassa koodilohkossa:





  • Käytä ensin '

    ' -tunniste näyttääksesi tekstin verkkosivun keskellä ' ' -tunniste. Anna myös valetiedot isoilla kirjaimilla.

  • Lisää seuraavaksi ' id '-attribuutti ja anna sille arvo ' muunnin ”. Tämä ' id ' käytetään tallentamaan

    -tunnisteen viittaus JavaScript-tunnisteen sisään.

Kokoonpanovaiheen päätyttyä:



Yllä oleva verkkosivun tilannekuva näyttää, että teksti on näytetty onnistuneesti.

Vaihe 2: Muunna isot kirjaimet otsikon kirjaimeksi
Muuntimen luomiseen käytetään JavaScriptin ominaisuuksia ja menetelmiä. Seuraa alla olevaa koodia, sen kuvaus alla:

< käsikirjoitus >
oli kohde = document.getElementById ( 'muunnin' ) .textContent.toLowerCase ( ) ;
kohde = kohde .korvata ( / \b\w / g,
toiminto ( alempi ) { palaa alemmas.suurin kirjain ( ) ; } ) ;
document.getElementById ( 'muunnin' ) .textContent = kohde ;
< / käsikirjoitus >

Yllä olevassa koodinpätkässä:

  • Luo ensin muuttuja nimeltä ' kohde ' sisällä '