Botón de desactivación CSS

Al diseñar una página web o un sitio web dinámico, es posible que desee deshabilitar cualquier función restringiendo o no permitiendo que el usuario acceda a ella. Por ejemplo, el botón o cualquier campo de texto está deshabilitado de acuerdo con el requisito. Los idiomas de front-end se utilizan para este propósito. Esto incluye tanto el HTML como las etiquetas CSS para crear y diseñar los objetos.

Se utiliza una hoja de estilo en cascada para agregar características especiales al contenido que se crea a través de las etiquetas HTML. CSS también está escrito en forma de etiquetas y se puede declarar de tres maneras. Aplicamos el enfoque de estilo interno. Las etiquetas HTML son bastante fáciles de implementar junto con CSS. El usuario debe ser consciente de los conceptos básicos de ambos idiomas.

Implementación del botón Desactivar

Primero, usamos las etiquetas HTML solo para crear botones. Una vez que se entiendan las etiquetas HTML para la creación del botón, será fácil para nosotros agregar el CSS al botón.

Comenzando con las etiquetas HTML, declaramos la sección principal. Dentro de la sección principal, declaramos el título de la página, que aparece en la pestaña del navegador. Entonces, cerramos el título y la etiqueta de la cabeza. Entonces, declaramos la etiqueta del cuerpo. Dentro del cuerpo, usamos la etiqueta Div. Un contenedor que se utiliza para contener y alinear su contenido en una forma especificada se conoce como contenedor Div. En el HTML, hay etiquetas incorporadas para varias características que se utilizan utilizando sus etiquetas de apertura y cierre. Del mismo modo, la etiqueta crea un botón. Creamos dos botones. Habilitamos un botón y deshabilitamos el otro. Esto se hace simplemente agregando la palabra clave "deshabilitado" al botón. De esta manera, podemos habilitar o deshabilitar el funcionamiento de un botón en la página web utilizando las etiquetas HTML simples.

No desactivado
Desactivado

Dado que tenemos que crear solo dos botones, cerrar todas las etiquetas y luego guardar el archivo. Para ejecutar la página web que creó, abra el archivo en el navegador.

Cuando ejecutamos el código, veremos que se crean dos botones. Uno está habilitado, mientras que el otro está deshabilitado. El botón y el texto en el botón deshabilitado están en un tono de color más claro y parece estar borroso, haciendo que el botón se vea como un texto en un bloque. Esto significa que el botón no funcionará.

Deshabilite el botón en CSS

Ahora, usamos tanto el HTML como el CSS para deshabilitar el botón específico. La parte de la creación Div es casi la misma, pero las etiquetas CSS se agregarán a la sección de la cabeza, haciendo un estilo interno. Debajo de las etiquetas de título, dentro de la sección de la cabeza, abre la etiqueta de estilo.