Hvordan øke avkrysningsruten i CSS

Hvordan øke avkrysningsruten i CSS

En avkrysningsrute er en inngangstype av HTML som lar brukeren ta et valg mellom to eller flere mulige alternativer. Det tillater brukeren å velge flere verdier fra en forhåndsdefinert liste. Som standard er avkrysningsruten i den lille firkantede boksen; Noen ganger er det imidlertid viktig å øke størrelsen på avkrysningsruten for å øke synligheten.

I denne håndboken vil vi forklare metoden for å øke størrelsen på avkrysningsruten ved hjelp av CSS.

Hvordan øke avkrysningsruten i CSS?

Du kan bruke avmerkingsbokser i HTML for å ta innspill fra brukere. Det tilbyr et forhåndsdefinert sett med verdier som brukeren kan ta et binært valg. For å øke avkrysningsruten størrelse, “dessuten dessutenbredde”Og“høyde”Egenskaper til CSS kan brukes.

Syntaks

Syntaks for disse egenskapene er:

Bredde: verdi
Høyde: Verdi


I stedet for “verdi”, Kan du angi“bredde”Og“høyde”Av ethvert element i henhold til dine preferanser.

La oss flytte til det praktiske eksemplet, hvor vi vil lage en avkrysningsrute og øke størrelsen ved å bruke “bredde”Og“høyde" egenskaper.

Eksempel: Lag en avkrysningsrute og øke størrelsen i CSS

For å øke avkrysningsruten størrelsen, vil vi først ta en inngangstype "avkrysningsrute”I HTML -filen inne i taggen:




Foreløpig er standardstørrelsen på avkrysningsruten som følger:


Gå nå til CSS for å øke størrelsen på avmerkingsboksen.

Her får vi tilgang til “inngang”Type definert i HTML -delen og angi bredden og høyden på avkrysningsruten som“50px”:

input
Bredde: 50px;
Høyde: 50px;


Vi har økt størrelsen på den opprettede avkrysningsruten ved hjelp av CSS -egenskaper for høyde og bredde:


Merk: For å øke størrelsen på avkrysningsruten, “bredde”Og“høyde”Begge egenskapene er nødvendige for å angi da størrelsen ikke endres hvis du spesifiserer en verdi.

Vi har dekket en enkel metode for å øke dimensjonen til avkrysningsruten i CSS.

Konklusjon

CSS “bredde”Og“høyde”Egenskaper brukes til å øke størrelsen på avkrysningsruten. Du kan spesifisere hvilken som helst verdi i "PX”Enheter for å stille størrelsen i henhold til dine krav. Imidlertid er verdier av begge egenskapene nødvendig for å endre størrelse på avkrysningsruten. I denne guiden har vi forklart prosedyren for å øke avkrysningsruten størrelse ved hjelp av CSS.