¿Cómo agregar una casilla de verificación en formularios usando HTML?

En este artículo, aprenderemos cómo agregar una casilla de verificación en formularios HTML. Básicamente, la casilla de verificación se usa para seleccionar una o más opciones de una variedad de opciones. Es una unidad de control múltiple que se presentará como un pequeño cuadro cuadrado en la pantalla. Normalmente, Checkbox tiene 3 estados, a saber: marcado, sin marcar e indeterminado. Se requiere en formularios cuando el usuario permite elegir múltiples opciones. 

Enfoque: Tenemos un enfoque simple para completar la tarea que se indica a continuación:

  • En primer lugar, cree un documento HTML que contenga una etiqueta <input>.
  • Ahora use el atributo de tipo con el elemento <input>.
  • Establezca el atributo de tipo en el valor «casilla de verificación»

Sintaxis

<input type="checkbox">

Ejemplo: 

HTML

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to add a checkbox in 
        forms using HTML?
    </title>
</head>
  
<body style="text-align: center;">
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
  
    <h2>
        How to add a checkbox in 
        forms using HTML?
    </h2>
  
    <form>
        <h4>
            choose any your 2 favourite Dishes
        </h4>
  
        Rajna chawal -->
        <input type="checkbox" name="dish1" 
            id="GFG" value="Rajma chawal" checked>
        <br>
  
        Shahi paneer -->
        <input type="checkbox" name="dish2" 
            value="Shahi paneer">
        <br>
  
        Kadi Chawal -->
        <input type="checkbox" name="dish3" 
                value="kadi Chawal">
        <br>
  
        Idli Sambhar -->
        <input type="checkbox" name="dish4" 
            value="Idli sambhar">
        <br>
        <input type="submit" value="submit">
    </form>
    <br>
</body>
  
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *