En développement Web, un formulaire est utilisé pour stocker des informations dans une base de données de manière organisée et la convertir directement en objets de base de données, tels que des tables, des listes et autres. Il autorise également l'utilisateur pour contrôler l'interface utilisateur en collectant des données. De plus, l'utilisateur peut également définir l'alignement du formulaire selon sa préférence.

Dans cet article, nous expliquerons:

• Méthode 1: Comment centrer un formulaire en HTML?
• Méthode 2: Comment centrer un formulaire dans CSS?

Méthode 1: Comment centrer un formulaire en HTML?

Vous pouvez utiliser le «»Élément pour concevoir un formulaire sur la page HTML. De plus, les utilisateurs peuvent définir l'alignement du formulaire dans HTML à l'aide d'un style en ligne.

Pour aligner un formulaire dans HTML, essayez la procédure indiquée.

Étape 1: insérer un titre

Tout d'abord, ajoutez une rubrique à l'aide d'une étiquette de cap HTML. Dans ce cas, le «

»La balise est utilisée.

Étape 2: Créez un formulaire

Ensuite, utilisez le «”Élément pour créer un formulaire sur la page HTML. Pour ce faire, suivez les instructions données:

• Le "style»L'attribut est utilisé pour définir le style en ligne d'un élément. L'attribut de style remplacera tout style en utilisant les propriétés CSS directement dans HTML. Dans ce scénario, la valeur de l'attribut «style» est définie comme «justifier-contenu: centre" et "Affichage: flexion".
• Le "justifier-contenu: centre"Le CSS en ligne est utilisé pour positionner le contenu du conteneur flexible lorsqu'ils ne remplissent pas l'intégralité de l'axe principal.
• En utilisant "Affichage: flexion”Dans les éléments radiculaires, les éléments enfants s'aligneront automatiquement avec la largeur et la hauteur de l'auto.
• Insérer un «”Elément et spécifiez le type d'entrée comme«texte"Et le nom comme"recherche".
• "taper»L'attribut est utilisé pour contrôler le type de données de l'élément d'entrée.
• Le "valeur»L'attribut détermine la valeur d'un«" élément. Il est également utilisé différemment pour différents types d'entrée:

Remplir le formulaire

Entrez votre nom

On peut voir que le formulaire est créé et aligné au centre dans une page HTML:

Méthode 2: Comment centrer un formulaire dans CSS?

Pour aligner un formulaire dans CSS, consultez les instructions déclarées.

Étape 1: Faites un conteneur div

Initialement, faites un conteneur div avec l'aide du «div”Element et ajoutez un attribut de classe avec un nom particulier.

Étape 2: Créez un formulaire

Ensuite, créez une forme avec l'aide du «”Tag et insérez l'élément suivant entre l'élément de forme:

• Le "»L'élément fournit l'étiquette d'un élément dans une interface utilisateur.
• "»Est utilisé pour créer des contrôles interactifs pour les formulaires Web pour recevoir des données de l'utilisateur. Pour ce faire, ajouter "taper","nom", et "espace réservé".
• "espace réservé»L'attribut est utilisé pour ajouter la valeur dans le champ de formulaire à afficher:

Entrez votre nom:




Entrer votre Email:

Sortir

Étape 5: Formulaire de style

Accéder au conteneur Div à l'aide d'un sélecteur d'attribut et spécifiez le nom du conteneur avec. Ensuite, appliquez les propriétés CSS mentionnées dans le bloc de code ci-dessous:

.forme centrale
Justification-contenu: centre;
Affichage: flex;
marge: 40px 50px;
Border: 3px bleu massif;
rembourrage: 30px;
Color en arrière-plan: RVB (208, 205, 248);

Ici:

• "justifier»La propriété CSS définit comment le navigateur distribue l'espace entre et autour des éléments de contenu le long de l'axe principal d'un conteneur flexible et l'axe en ligne d'un récipient de grille.
• "afficher”Est ​​utilisé pour définir le comportement d'affichage d'un élément.
• "marge"Est utilisé pour ajouter l'espace à l'extérieur de la limite définie autour de l'élément.
• "frontière»Spécifie la bordure autour de l'élément.
• "rembourrage»Détermine l'espace autour de l'élément défini à l'intérieur de la limite.
• "Couleur de l'arrière plan”Définit la couleur d'arrière-plan à l'arrière de l'élément.

On peut observer que la forme est centrée sur l'alignement:

Nous vous avons appris la méthode d'alignement de la forme au centre.

Conclusion

Pour aligner un formulaire, il existe différentes méthodes. La première consiste à utiliser la méthode de style en ligne dans HTML. Deuxièmement, l'utilisateur peut également appliquer les propriétés CSS après avoir accédé au formulaire dans CSS. Pour ce faire, le «justifier«Propriété avec la valeur»centre" et "afficher"Définir comme"fléchir«Sont utilisés pour définir l'alignement de la forme au centre. Ce message a démontré la méthode pour aligner le formulaire.