Divisions
Fait partie de la section Fundamentals du Journey HTML de Coddy — leçon 25 sur 60.
Imaginez que vous vouliez diviser votre page web en blocs pour organiser votre contenu. En HTML, vous pouvez utiliser un div pour regrouper des éléments ensemble.
Les balises div sont idéales pour créer des mises en page et séparer des sections.
Voici la syntaxe de base :
<div>
<!-- Le contenu va ici -->
</div>Vous pouvez ajouter d'autres éléments HTML à l'intérieur d'un div, tels que des paragraphes, des titres, des images et même d'autres éléments div.
Voici un exemple d'utilisation des balises div pour créer une mise en page simple avec un en-tête, une zone de contenu principal et un pied de page :
<div>
<h1>Header</h1>
</div>
<div>
<p>Main content goes here.</p>
</div>
<div>
<p>Footer</p>
</div>Défi
FacileCréez 3 éléments div, placés les uns après les autres dans votre document HTML.
À l'intérieur de chaque div, ajoutez une balise p qui contient le nom d'un film que vous aimez.
Aide-mémoire
Utilisez des balises div pour regrouper des éléments et organiser le contenu en blocs :
<div>
<!-- Le contenu va ici -->
</div>Vous pouvez imbriquer d'autres éléments HTML à l'intérieur d'un div, y compris des paragraphes, des titres, des images et d'autres éléments div :
<div>
<h1>Header</h1>
</div>
<div>
<p>Main content goes here.</p>
</div>
<div>
<p>Footer</p>
</div>Essayez vous-même
<!DOCTYPE html>
<html>
<body>
<!-- Écrivez votre code ici -->
</body>
</html>Cette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.
Toutes les leçons de Fundamentals
1Les bases du HTML
Qu'est-ce que le HTML ?Structure de base du HTMLBalises et élémentsImbrication et fermeture des balisesCommentaires en HTML7Page de profil personnel
Présentation du projetSection d'en-tête2Texte et mise en forme
TitresParagraphesSauts de ligneTexte en gras et italiqueGras et italique (suite)Récapitulatif - Mise en forme8Formulaires et champs de saisie, partie 1
Bases des formulairesChamps de texteAttributs des champsChamp de mot de passeLibellés pour les champsRécapitulatif - Formulaire de base11Page d'inscription à un événement
Aperçu du projetSection d'en-tête3Travailler avec les listes
Liste non ordonnéeListe ordonnéeListes imbriquéesRécapitulatif - Les listes6Mise en page
DivisionsSpans en ligneBalises sémantiquesSections et articlesRécapitulatif - Mise en page