En HTML, la balise <body> est utilisée pour définir le contenu principal d'un document HTML. C'est à l'intérieur de cette balise que vous placez tout le contenu visible sur votre page web, tel que du texte, des images, des liens, des formulaires, etc. Voici quelques exemples pour illustrer comment utiliser la balise <body> avec différents éléments HTML :
html<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exemple 1</title>
</head>
<body>
<h1>Titre principal</h1>
<p>Ceci est un paragraphe de texte.</p>
</body>
</html>
Dans cet exemple, la balise <body> enveloppe un titre principal (<h1>) et un paragraphe (<p>).
html<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exemple 2</title>
</head>
<body>
<h2>Liste de courses</h2>
<ul>
<li>Pain</li>
<li>Lait</li>
<li>Œufs</li>
</ul>
</body>
</html>
Ici, la balise <body> enveloppe un titre de deuxième niveau (<h2>) et une liste à puces (<ul>) avec trois éléments de liste (<li>).
html<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exemple 3</title>
</head>
<body>
<h3>Image de paysage</h3>
<img src="paysage.jpg" alt="Paysage magnifique">
</body>
</html>
Dans cet exemple, la balise <body> enveloppe un titre de troisième niveau (<h3>) et une balise <img> qui affiche une image avec l'attribut src spécifiant le chemin de l'image et l'attribut alt fournissant un texte alternatif.
html<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exemple 4</title>
</head>
<body>
<h4>Formulaire de contact</h4>
<form action="/submit" method="post">
<label for="nom">Nom :</label>
<input type="text" id="nom" name="nom" required>
<label for="email">Email :</label>
<input type="email" id="email" name="email" required>
<input type="submit" value="Envoyer">
</form>
</body>
</html>
Ici, la balise <body> enveloppe un titre de quatrième niveau (<h4>) et un formulaire (<form>) avec des champs de saisie de texte (<input>) pour le nom et l'e-mail, ainsi qu'un bouton de soumission (<input type="submit">).