En el desarrollo web, se utiliza un formulario para almacenar información en una base de datos de manera organizada y convertirla directamente en objetos de base de datos, como tablas, listas y otras. También autoriza al usuario para controlar la interfaz de usuario recopilando datos. Además, el usuario también puede establecer la alineación del formulario según sus preferencias.

En este artículo, explicaremos:

• Método 1: Cómo centrar alinear un formulario en HTML?
• Método 2: Cómo centrar alinear un formulario en CSS?

Método 1: Cómo centrar alinear un formulario en HTML?

Puedes utilizar el "El elemento para diseñar un formulario en la página HTML. Además, los usuarios pueden establecer la alineación del formulario en HTML con la ayuda del estilo en línea.

Para alinear un formulario en HTML, pruebe el procedimiento establecido.

Paso 1: inserte un encabezado

En primer lugar, agregue un encabezado con la ayuda de una etiqueta de encabezado HTML. En este caso, el "

Se usa la etiqueta.

Paso 2: crear un formulario

A continuación, utilice el "Elemento "para crear un formulario en la página HTML. Para hacerlo, siga las instrucciones dadas:

• El "estilo"El atributo se usa para establecer el estilo en línea de un elemento. El atributo de estilo anulará cualquier estilo utilizando las propiedades CSS directamente en HTML. En este escenario, el valor del atributo "estilo" se establece como "Justify-Content: Centro" y "Pantalla: Flex".
• El "Justify-Content: Centro"Se emplea en línea CSS para colocar el contenido del contenedor flexible cuando no llenan todo el eje principal.
• Mediante el uso "Pantalla: Flex"En los elementos raíz, los elementos infantiles se alinearán automáticamente con el ancho y la altura automáticamente.
• Inserte un "Elemento "y especifique el tipo de entrada como"texto"Y el nombre como"buscar".
• "tipoEl atributo se utiliza para controlar el tipo de datos del elemento de entrada.
• El "valor"El atributo determina el valor de un"" elemento. También se usa de manera diferente para diferentes tipos de entrada:

Rellenar el formulario

Introduzca su nombre

Se puede ver que el formulario está creado y alineado en un centro en una página HTML:

Método 2: Cómo centrar alinear un formulario en CSS?

Para alinear un formulario en CSS, consulte las instrucciones establecidas.

Paso 1: Haz un contenedor Div

Inicialmente, haga un contenedor Div con la ayuda del "divElemento y agregar un atributo de clase con un nombre en particular.

Paso 2: crear un formulario

A continuación, cree un formulario con la ayuda del ""Etiqueta e inserte el siguiente elemento entre el elemento de formulario:

• El "El elemento "proporciona la etiqueta para un elemento en una interfaz de usuario.
• ""Se utiliza para crear controles interactivos para formularios basados ​​en la web para recibir datos del usuario. Para hacerlo, agregue "tipo","nombre", y "marcador de posición".
• "marcador de posiciónEl atributo se utiliza para agregar el valor en el campo Formulario para mostrar:

Introduzca su nombre:




Introduce tu correo electrónico:

Producción

Paso 5: Forma de estilo

Acceda al contenedor Div con la ayuda de un selector de atributos y especifique el nombre del contenedor con él. Luego, aplique las propiedades CSS mencionadas en el siguiente bloque de código:

.forma central
Justify-Content: Center;
Pantalla: Flex;
margen: 40px 50px;
borde: 3px azul sólido;
relleno: 30px;
Color de fondo: RGB (208, 205, 248);

Aquí:

• "Justify-ContentLa propiedad CSS define cómo el navegador distribuye el espacio entre los elementos de contenido entre y alrededor del eje principal de un contenedor flexible y el eje en línea de un contenedor de cuadrícula.
• "mostrar"Se usa para establecer el comportamiento de visualización de un elemento.
• "margen"Se usa para agregar el espacio fuera del límite definido alrededor del elemento.
• "borde"Especifica el borde alrededor del elemento.
• "relleno"Determina el espacio alrededor del elemento definido dentro del límite.
• "color de fondo"Establece el color de fondo en la parte trasera del elemento.

Se puede observar que la forma está centrada alineada:

Te hemos enseñado el método para alinear la forma en el centro.

Conclusión

Para alinear un formulario, hay varios métodos. El primero es utilizar el método de estilo en línea en HTML. En segundo lugar, el usuario también puede aplicar las propiedades CSS después de acceder al formulario en CSS. Para hacerlo, el "Justify-Content"Propiedad con el valor"centro" y "mostrar" establecer como "doblar"Se utilizan para establecer la alineación del formulario en el centro. Esta publicación ha demostrado el método para alinear el formulario.