Cómo crear una lista desplegable en una forma html5

Las listas desplegables son una característica común en las páginas web, y HTML5 hace que la creación de ellos bastante infalible. Las listas desplegables permiten, el programador, especificar una serie de opciones que los visitantes de su sitio web puede hacer sin necesidad de escribir (una lista se muestra en la figura). Las listas desplegables son especialmente agradable, ya que no requieren una gran cantidad de espacio en pantalla - las opciones sólo son visibles mientras el usuario está seleccionando ellos.

Las listas desplegables tienen un atributo muy valioso ya que impiden que ciertos tipos de errores. Las opciones limitadas hacen que la respuesta muy predecible porque predeterminar todas las respuestas posibles. Usted no tiene que hacer frente a todas las cosas locas usuarios pueden escribir en un cuadro de texto.

En HTML5 / XHTML, listas desplegables se crean dos tipos de objeto. La estructura general utiliza el etiquetas, mientras que cada una de las posibles opciones tiene sus propias etiqueta, ya que el código de una página web con una lista desplegable muestra:

formDemo.htmlFormulario de demostración

La lista de selección es una potencia real, por lo que usted debe saber cómo hacerlo:

Cree el elemento primero.
El contenedor de la lista es un elemento. La lista completa está encerrado en el par.
Dame el seleccionar elemento de un ID.
Vamos a usar este ID para referirse al elemento en el código.
Añadir un opción elemento al elemento select.
Ayuda a sangrar las opciones para recordar que son parte de la seleccionar objeto.
Dé a cada opción de un valor.
El valor es la respuesta enviada a un programa cuando el usuario elige una opción. El usuario no verá necesariamente el valor.
Indique el texto que el usuario verá entre el y las etiquetas.
Esto puede ser diferente del valor, o el mismo. (Eso hará más sentido después de hacer la codificación algo de javascript.)
Añadir tantas opciones como desee.
Crea un nuevo objeto opción para cada opción que desea tener disponible en la lista.

Seleccione las cajas no lo hacen tener tener el comportamiento desplegable. Si desea que el cuadro para ocupar más espacio vertical en la página, basta con especificar el número de filas con el tamaño atribuir.

Sobre el autor

Cómo crear una lista desordenada de HTML5 y CSS3 programación

Todos los tipos de listas en HTML5 están estrechamente relacionados. El tipo más simple y más común de la lista es una lista desordenada. También puede utilizar listas ordenadas y listas anidadas en HTML.Mira una lista desordenadaMira la…

Cómo crear listas con viñetas en html5

LA lista con viñetas contiene uno o más elementos de cada uno precedido por una bala (a menudo un gran punto). Utilice este tipo de lista en su página web, si para los elementos 'no es necesaria para la comprensión de la información que…

Cómo crear campos de lista desplegable en html5

Las listas desplegables en formularios en su sitio web son una gran manera de dar a los usuarios una gran cantidad de opciones en una pequeña cantidad de espacio en la pantalla. Utiliza dos etiquetas HTML para crear una lista desplegable: crea la…

Cómo crear listas numeradas en html5

Las listas son herramientas poderosas para agrupar elementos similares, y en las listas a los visitantes a su sitio una manera fácil de hacer zoom en grupos de información. Casi cualquier cosa cabe en una lista, a partir de conjuntos de…

Cómo crear listas ordenadas para HTML5 y CSS3 programación

Las listas ordenadas en HTML5 son casi exactamente igual que las listas no ordenadas. Las listas ordenadas tradicionalmente tienen números en lugar de balas (aunque se puede cambiar esto a través de CSS si no desea que los números).Cómo ver una…

Cómo hacer listas de enlaces para HTML5 y programación css3

Muchas páginas web resultan ser listas de enlaces en la programación HTML5 y CSS3. Porque las listas y enlaces van tan bien juntos, es bueno mirar un ejemplo. Observe esta lista de enlaces a libros escritos por un determinado autor.Este ejemplo no…

Cómo utilizar casillas de verificación y botones de opción en el formulario de html5

Al crear un formulario de recogida de datos para su sitio web, aunque sólo un conjunto finito de valores posibles está disponible para el usuario, puede le da un conjunto de opciones para elegir:Casillas de verificación: Elegir más de una…

Cómo crear un cuadro de lista de selección múltiple en javascript para HTML5 y CSS3 programación

Usted puede utilizar el código javascript seleccionar objeto de una manera poderosa para sus necesidades de programación HTML5 y CSS3. Para hacer el trabajo de selección múltiple, lo que tienes que hacer algunos cambios tanto en el HTML y…

Cómo crear listas desplegables en javascript para HTML5 y CSS3 programación

La manera más obvia de utilizar javascript para garantizar que el usuario introduce algo válido en su página HTML5 es que le proporcione opciones válidas. La lista desplegable es una forma obvia y fácil de hacer esto.El enfoque de la lista…

Cómo construir una casilla de verificación en el formulario de html5

A veces, desea que los usuarios de la página web para indicar si la información es verdadera o falsa. El HTML5 caja elemento es perfecto para este tipo de entrada debido a que el usuario puede hacer clic para activar o desactivar la opción. Las…

¿Cómo poner cuadros de texto en una forma html5

Muchos de los usos elementos de formulario HTML 5 se basan en el entrada etiqueta. Este caballo de batalla de fomento de la página web es una etiqueta de propósito general que se utiliza para hacer una serie de interesantes objetos de entrada,…

Cómo revisar su presupuesto en Quicken 2014

Después de completar su presupuesto en Quicken 2014, tendrá que revisar su obra, por supuesto. Y usted realiza su revisión mediante ventana de Presupuestos del Quicken y sus anónimos, listas y cuadros desplegables no marcados. (Consulte las…

maniqui-es.com » Los medios de comunicación de Internet y sociales » Diseño y desarrollo web » Páginas web de construcción » Cómo crear una lista desplegable en una forma html5