Teoría
Teoría

Una lista desplegable

Al igual que los botones de opción, una lista desplegable permite elegir una opción entre varias.

Se crea con la etiqueta de apertura y cierre <select>, que tiene los atributos name e id que ya conocemos.

Las opciones se definen con etiquetas de apertura y cierre <option>, que deben estar dentro de <select>. Por ejemplo:

<select name="theme">
  <option value="light">Tema claro</option>
  <option value="dark">Tema oscuro</option>
  ...
</select>

El atributo value de <option> define el valor de la opción, mientras que su texto se escribe entre las etiquetas de apertura y cierre.

Al enviar el formulario, si la opción elegida tiene un atributo value, se envía el valor de ese atributo. De lo contrario, se envía el texto de la opción.

index.html
style.css

HTML

<!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8"> <title>Una lista desplegable</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Cuestionario</h1> <form action="https://echo.htmlacademy.ru/courses" method="post"> <p>Las listas desplegables se usan a menudo para elegir una fecha.</p> <p><i>Tu año de nacimiento</i></p>  <input type="submit" value="Enviar"> </form> </body> </html>

CSS

input[type="submit"] { display: block; margin-top: 10px; }

ObjetivosRealizado

Agrega al formulario una lista desplegable con el nombre year.
Agrega a la lista una opción con el valor 2000 y el texto Año 2000.
Agrega otra opción con el valor 2001 y el texto Año 2001.

Prueba enviar el formulario.