Cómo aumentar el tamaño de la casilla de verificación en CSS

Una casilla de verificación es un tipo de entrada de HTML que permite al usuario elegir entre dos o más opciones posibles. Permite al usuario seleccionar múltiples valores de una lista predefinida. Por defecto, la casilla de verificación está en la casilla cuadrada pequeña; Sin embargo, a veces, es importante aumentar el tamaño de la casilla de verificación para aumentar su visibilidad.

En este manual, explicaremos el método para aumentar el tamaño de la casilla de verificación usando CSS.

Cómo aumentar el tamaño de la casilla de verificación en CSS?

Puede utilizar las casillas de verificación en HTML para obtener la entrada de los usuarios. Ofrece un conjunto de valores predefinidos que usa el que el usuario puede tomar una elección binaria. Además, para aumentar el tamaño de la casilla de verificación, el "ancho" y "alturaSe pueden utilizar las propiedades de CSS.

Sintaxis

La sintaxis de estas propiedades es:

Ancho: valor
Altura: valor

En lugar de "valor", Puedes configurar el"ancho" y "altura"De cualquier elemento según sus preferencias.

Pasemos al ejemplo práctico, donde crearemos una casilla de verificación y aumentaremos su tamaño usando "ancho" y "altura" propiedades.

Ejemplo: cree una casilla de verificación y aumente su tamaño en CSS

Para aumentar el tamaño de la casilla de verificación, primero, tomaremos un tipo de entrada "caja"En el archivo HTML dentro de la etiqueta:

Actualmente, el tamaño predeterminado de la casilla de verificación es el siguiente:

Ahora, muévase al CSS para aumentar el tamaño de la casilla de verificación.

Aquí, accederemos al "aporte"Tipo definido en la sección HTML y establezca el ancho y la altura de la casilla de verificación como"50px":

aporte
Ancho: 50px;
Altura: 50px;

Hemos aumentado con éxito el tamaño de la casilla de verificación creada con la ayuda de las propiedades CSS de altura y ancho:

Nota: Para aumentar el tamaño de la casilla de verificación ","ancho" y "altura"Ambas propiedades son necesarias para establecerse, ya que el tamaño no cambia si especifica un valor.

Hemos cubierto un método simple para aumentar la dimensión de la casilla de verificación en CSS.

Conclusión

El CSS "ancho" y "alturaLas propiedades se utilizan para aumentar el tamaño de la casilla de verificación. Puede especificar cualquier valor en el "px"Unidades para establecer el tamaño de acuerdo con sus requisitos. Sin embargo, se necesitan valores de ambas propiedades para cambiar el tamaño de la casilla de verificación. En esta guía, hemos explicado el procedimiento para aumentar el tamaño de la casilla de verificación usando CSS.