Tässä oppaassa saamme käsityksen siitä, kuinka syöttökenttä poistetaan käytöstä CSS:n avulla. Joten, aloitetaan!
Kuinka poistaa syöttökenttä käytöstä CSS:n avulla?
CSS:ssä tapahtumat poistetaan käytöstä käyttämällä ' osoitin-tapahtumat ” omaisuutta. Joten ensin oppia osoitin-tapahtumat-ominaisuudesta.
Mikä on 'osoitintapahtumat' CSS-ominaisuus?
' osoitin-tapahtumat ” hallitsee, miten HTML-elementit reagoivat tai käyttäytyvät kosketustapahtumaan, kuten napsautus- tai napautustapahtumiin, aktiivisiin tai hover-tiloihin ja onko kohdistin näkyvissä vai ei.
Syntaksi
Osoitintapahtumien syntaksi annetaan seuraavasti:
osoitin-tapahtumat : auto | ei mitään ;
Yllä mainittu ominaisuus ottaa kaksi arvoa, kuten ' auto ' ja ' ei mitään ':
- auto: Sitä käytetään oletustapahtumien suorittamiseen.
- ei mitään: Sitä käytetään tapahtumien poistamiseen.
Suuntaa annettuun esimerkkiin.
Esimerkki 1: Syöttökentän lisääminen CSS:n avulla
Tässä esimerkissä luomme ensin div ja lisäämme siihen otsikon ja syöttökentän. Aseta sitten syöttötyypiksi ' teksti ja aseta sen arvoksi Kirjoita nimesi ”.
HTML
< div >< keskusta >
< h1 > Poista syöttökenttä käytöstä < / h1 >
< syöttö tyyppi = 'teksti' arvo = 'Kirjoita nimesi' >
< / keskusta >
< / div >
Siirry sen jälkeen CSS:ään ja muotoile div asettamalla sen taustaväriksi ' rgb(184, 146, 99) ' ja korkeus ' 150 pikseliä ”.
CSS
div {tausta- väri- : rgb ( 184 , 146 , 99 ) ;
korkeus : 150 pikseliä;
}
Yllä kuvatun koodin tulos on annettu alla. Tässä näemme, että syöttökenttämme on tällä hetkellä aktiivinen ja hyväksyy syötteen käyttäjältä:
Siirry nyt seuraavaan osaan, jossa käytämme ' osoitin-tapahtumat ' omaisuutta nimellä ' ei mitään ”.
Esimerkki 2: Syöttökentän poistaminen käytöstä CSS:n avulla
Käytämme nyt ' syöttö ' päästäksesi HTML-tiedostoon lisättyyn -elementtiin ja asettamaan osoitintapahtumien arvoksi ' ei mitään ':
syöttö {osoitin-tapahtumat : ei mitään ;
}
Kun olet ottanut yllä mainitun ominaisuuden käyttöön ' osoitin-tapahtumat ' kanssa ' ei mitään ”-arvoa, syöttökentän tekstiä ei voi muokata, mikä osoittaa, että syöttökenttämme on poistettu käytöstä:
Se siitä! Olemme selittäneet menetelmän, jolla syöttökenttä poistetaan käytöstä CSS:n avulla.
Johtopäätös
Jos haluat poistaa syöttökentän käytöstä HTML-koodissa, ' osoitin-tapahtumat ” CSS:n omaisuutta käytetään. Voit tehdä tämän lisäämällä syöttökentän ja asettamalla osoitintapahtumien arvoksi ' ei mitään ' poistaaksesi syöttökentän käytöstä. Tässä oppaassa selitämme menetelmän syöttökentän poistamiseksi käytöstä CSS:n avulla ja annamme siitä esimerkin.