Menu
CoddyTech

Repaso - Formularios #1

Parte de la sección Fundamentos del Journey de HTML de Coddy. Lección 46 de 60.

challenge icon

Desafío

Fácil

Vamos a crear un formulario sencillo para pedir bebidas con HTML, como se muestra en la imagen de abajo.

Esto es lo que debes incluir:

  1. Una etiqueta <form> para envolverlo todo.
  2. Un grupo de botones de opción (name: "drink") para que los usuarios puedan elegir su bebida. Las etiquetas deben ser "Water", "Coke" o "Sprite". Asigna a cada botón de opción un id que sea su etiqueta en minúsculas: "water", "coke", "sprite".
  3. Un grupo de casillas de verificación (name: "extras") para los complementos opcionales. Las etiquetas deben ser "Ice", "Lemon" o "Sugar". Asigna a cada casilla de verificación un id que sea su etiqueta en minúsculas: "ice", "lemon", "sugar".
  4. Un menú desplegable (name: "size") para elegir el tamaño de la bebida. Las opciones deben ser "Small", "Medium" o "Large".
  5. Un botón de envío con la etiqueta "Place Order".
  6. Un botón para restablecer con la etiqueta "Clear".

⚠️ Importante: Usa solo una etiqueta <form>. HTML no permite etiquetas <form> anidadas: colocar una etiqueta <form> dentro de otra es inválido y hará que tus campos de entrada se detecten fuera del formulario, lo que hará que fallen las pruebas. Coloca todos los botones de opción, las casillas de verificación, el menú desplegable y los botones directamente dentro de la única etiqueta <form> exterior: no envuelvas secciones en etiquetas <form> adicionales.

Pruébalo tú mismo

<!DOCTYPE html>
<html>
    <body>
        <form>
            <p>Select a drink: </p>
            <!-- Escribe código aquí -->
            
            <p>Select extras: </p>
            <!-- Escribe código aquí -->
            
            <p>Select size: </p>
            <!-- Escribe código aquí -->
            
        </form>
    </body>
</html>

Todas las lecciones de Fundamentos

Practica por tu cuenta: Playground de Web