Bootstrap - Formulario de demostración
Diseño de formulario
Bootstrap le proporciona los siguientes tipos de diseños de formularios:
- Forma vertical (predeterminada)
- Formulario en línea
- Forma horizontal
Forma vertical o básica
La estructura de formulario básica viene con Bootstrap; los controles de formulario individuales reciben automáticamente un estilo global. Para crear un formulario básico, haga lo siguiente:
Agregue un formulario de función al elemento <form> padre.
Envuelva las etiquetas y los controles en un <div> con la clase .form-group . Esto es necesario para un espaciado óptimo.
Agregue una clase de .form-control a todos los elementos textuales <input>, <textarea> y <select>.
Formulario en línea
Para crear un formulario donde todos los elementos están alineados, alineados a la izquierda y las etiquetas están al lado, agregue la clase .form-inline a la etiqueta <form>.
Forma horizontal
Las formas horizontales se distinguen de las demás no solo en la cantidad de marcado, sino también en la presentación del formulario. Para crear un formulario que utilice el diseño horizontal, haga lo siguiente:
Agregue una clase de .form-horizontal al elemento primario <form>.
Envuelva las etiquetas y los controles en un <div> con la clase .form-group .
Agregue una clase de .control-label a las etiquetas.
| Ejemplo | Descripción | Enlace de descarga |
|---|---|---|
| Página de inicio de sesión | Este ejemplo indica la estructura de la página de inicio de sesión en Bootstrap | Descargar |
| Pagina de contacto | Este ejemplo indica la estructura de la página de contacto en Bootstrap | Descargar |
| Página de registro | Este ejemplo indica la estructura de la página de registro en Bootstrap | Descargar |