Tag html div | expliqué

La div fait référence à la division ou à la section dans un document HTML. C'est un conteneur vide qui peut contenir divers éléments HTML. Le but du div est d'ajouter des styles CSS spécifiques aux éléments utilisés dans la balise Div respective. La balise DIV appartient à la catégorie d'éléments de bloc HTML et démarre ainsi une nouvelle ligne chaque fois qu'elle est initiée.

Un div peut contenir plusieurs autres divisions et chaque div contient diverses propriétés de style. Le but principal d'une div est de faire un groupe de types d'éléments similaires afin qu'ils puissent être stylés facilement. En raison de sa fonctionnalité étendue, il est appelé la balise clé lors du développement d'une page Web à l'aide de HTML. Dans cet article, nous avons démontré le fonctionnement de la balise Div, et quelques exemples sont illustrés pour montrer l'utilisation de la balise div.

Comment fonctionne le tag html div

La balise DIV comprend des balises de démarrage et de fermeture et la syntaxe suivante est utilisée pour créer un div dans HTML.

Tout ce qui est écrit entre ces balises adoptera les valeurs définies pour cette div. Pour une compréhension de base, un div est créé en utilisant le code suivant.

Un div est créé sur la page Web

c'est div

Le code est décrit comme suit:

- Le titre de la page sera «div balise»

- Le fond du corps est réglé sur «Green de mer légère»

- Une div est créée et sa couleur d'arrière-plan est réglée sur «jaune»

- Un paragraphe est créé dans Div Tag

L'image du code est fournie ci-dessous:

La sortie de la page Web est présentée ci-dessous:

Les observations suivantes peuvent être faites à partir de la sortie ci-dessus:

- La balise div crée une nouvelle ligne

- occupe toute la largeur (si la limite n'est pas définie) de la page

Comment utiliser la balise HTML Div

Le fonctionnement de base de la balise div est expliqué dans la section ci-dessus. Cependant, cette section explique l'utilisation de l'étiquette HTML Div dans divers scénarios. Comme indiqué précédemment, plusieurs éléments sont contenus dans un div pour coiffer tous ces éléments de la même manière. Comme le style est possible avec CSS, il est recommandé d'utiliser une classe CSS en ligne ou externe.

Exemple 1: Utilisation d'une balise HTML Div avec plusieurs classes CSS

Une balise Div peut être utilisée avec plusieurs classes CSS. Pour pratiquer cette fonctionnalité, le code HTML suivant est utilisé:

La div utilisant deux classes CSS

Bienvenue à Linuxhint

une vallée de la technologie

Le code est décrit ci-dessous:

- Deux classes CSS sont créées nommées «Color» et «Misc».

- La classe de couleurs définit la «couleur d'arrière-plan» et la «couleur de la police», tandis que la classe Misc contient la «largeur», le «rembourrage» et le «style de police»

- Un div est créé avec un attribut de classe et a utilisé le nom des deux classes dedans

- Trois éléments HTML

,

et sont utilisés dans le div

Note: Lorsque vous utilisez plusieurs noms de classes dans un attribut de classe de div balise, vous devez ajouter un espace entre les noms de classe pour différencier les deux classes.

L'image du code est fournie ci-dessous:

La sortie du code HTML sur une page Web est indiquée ci-dessous:

Exemple 2: Utilisation de plusieurs balises Div

Utiliser plusieurs div est la partie déroutante de la balise HTML Div. Le code HTML suivant fait référence à l'utilisation de plusieurs div avec divers

Premier div

Bienvenue à Linuxhint

Deuxième div

fournisseur de contenu de premier plan

Le code est décrit comme:

- a créé deux classes CSS nommées «First» et «Second»

- La «première» classe définit «Color en arrière-plan», «couleur de police», largeur, «flotteur»

- La classe «Second» a des propriétés comme «fond de fond», «largeur», «flottante»

- Un div est initialisé avec un attribut de classe et «d'abord» comme valeur de l'attribut

- Un autre div est créé avec «Second» comme valeur de l'attribut de classe

L'image du code est illustrée ci-dessous:

La sortie de la page Web est présentée ci-dessous:

Conclusion

La balise Div dans HTML fait référence à la création d'un conteneur qui vous permet de créer un groupe d'éléments HTML qui peuvent être stylisés de la même manière. Cet article a démontré le mécanisme de travail de l'étiquette Div. De plus, plusieurs exemples sont indiqués qui montrent comment une balise HTML Div peut être utilisée dans divers scénarios.