Dans HTML, la balise est la balise la plus importante et est utilisée dans la plupart des documents. La balise est considérée comme le conteneur pour d'autres balises HTML. Par conséquent, il peut être utilisé pour appliquer plusieurs balises HTML sur une partie souhaitée du document.

La balise peut également être utilisée pour diviser une page HTML en plusieurs sections. Cet article vise à vous guider comment les balises div peuvent être utilisées pour diviser la page. Les résultats suivants sont attendus:

• Comment utilisons-nous les balises Div pour diviser les pages HTML dans des sections horizontales?
• Comment utilisons-nous les balises Div pour diviser les pages HTML dans des sections verticales?

Comment utilisons-nous Div Tag pour diviser la page HTML dans les sections horizontales?

Dans HTML, une balise agit comme une section pour les données de la page HTML. Pour diviser une page en sections, vous devez écrire les balises HTML requises à l'intérieur de la balise. Voyons l'exemple pratique ci-dessous pour comprendre la division des pages HTML par tag.

Html

Diviser la page HTML en utilisant la balise

Section 1
Section 2
Section 3

Dans ce code, nous avons utilisé trois balises. Ces balises sont associées aux trois classes CSS. Le code CSS utilisé dans le code HTML ci-dessus est fourni ci-dessous:

CSS

div

Texte-aligne: Centre;
taille de police: 30px;
Couleur blanche;
rembourrage: 10px;
Affichage: flex;
Align-Items: Centre;
Justification-contenu: centre;
hauteur: 150px;
Largeur: 98%;

.un

Color en arrière-plan: limegreen;

.deux

Color en arrière-plan: orange;

.trois

Color en arrière-plan: hotpink;

Dans la partie CSS, nous avons ciblé les trois balises pour formater le contenu de tous les div. Pour donner différentes couleurs à chaque div, trois classes "un","deux", et "trois" sont créées.

Sortir

La sortie montre qu'une page Web est divisée en trois sections à l'aide de la balise HTML.

Comment utilisons-nous Div Tag pour diviser la page HTML dans les sections verticales?

Dans HTML, nous pouvons utiliser TAG pour diviser une page Web en sections verticales. Voyons l'exemple pratique ci-dessous pour comprendre la division verticale d'une page HTML en utilisant TAG.

Html

Diviser la page HTML en utilisant la balise

Section 1
Section 2
Section 3

Dans ce code, nous avons créé trois sections en utilisant la balise. Pour une meilleure présentation, nous avons appliqué le CSS suivant sur les étiquettes DIV:

CSS

div

Texte-aligne: Centre;
taille de police: 30px;
Couleur blanche;
rembourrage: 10px;
Affichage: flex;
Align-Items: Centre;
Justification-contenu: centre;
hauteur: 500px;
Largeur: 30%;

.un

Color en arrière-plan: limegreen;
flottant: à gauche;

.deux

Color en arrière-plan: orange;
flottant: à gauche;

.trois

Color en arrière-plan: hotpink;
flottant: à gauche;

Dans la partie CSS, nous ciblons tous les divs et utilisons différentes propriétés pour donner la taille, la largeur, le rembourrage et la taille de la police de fond au contenu div. Il est observé que les sections verticales sont créées à l'aide de flotter la propriété de CSS et sa valeur sont définies sur gauche.

Sortir

La sortie montre qu'une page Web est divisée en trois sections à l'aide de la balise HTML.

Conclusion

Dans HTML, nous pouvons diviser une page Web entière en sections en utilisant TAG avec le CSS. Par défaut, une balise divise une page Web en sections horizontales. Cependant, vous pouvez utiliser la propriété flottante de CSS pour fabriquer les sections verticales de la page Web. En suivant ce guide, vous pouvez appliquer TAG pour diviser la page HTML.