<body>
La balise <body> est un élément incontournable en HTML. Elle contient tout le contenu visible d'une page web, tel que les boutons, les images et les éléments textuels par exemple
Le contenu placé dans la balise <body> est ensuite affiché par le navigateur pour être visible et utilisable sur les écrans des utilisateurs.
Elle est toujours incluse après la balise
<head>. 😉
Structure et syntaxe de la balise <body>
Structure et syntaxe de base
La balise <body> est un conteneur : elle est donc utilisée avec :
- une balise d'ouverture
<body>; - et de fermeture
</body>.
Voici comment l'utiliser (assez simple vous allez voir !) :
<body>
<!-- Vos balises d'images, boutons, textes -->
</body>
Exemple d'utilisation
Comme il est toujours plus facile de se faire une idée avec un exemple complet, en voici un ! ☝️
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Exemple de balise body</title>
</head>
<body>
<header>
<h1>Bienvenue sur mon site</h1>
</header>
<main>
<p>Ceci est un exemple de contenu dans la balise <strong><body></strong>.</p>
<a href="https://believemy.com">Visitez ce lien</a>
</main>
<footer>
<p>Copyright © 2025</p>
</footer>
</body>
</html>Comme nous pouvons le voir ici, seul les éléments dans <body> sont affichés sur l'écran des utilisateurs. Testez par vous-même :
Attributs de la balise <body>
La balise <body> peut inclure tous les attributs "classiques" mais elle en contient également deux autres spécifiques.
| Attribut | Description |
|---|---|
onload | Exécute du JavaScript après le chargement de la page. |
onunload | Exécute du JavaScript juste avant de quitter la page. |
Prenons un petit exemple pour illuster ces deux attributs différents :
<body onload="alert('Page chargée !')" onunload="alert('Au revoir !')">
<h1>Mon super beau site</h1>
<p>Bonjour tout le monde.</p>
</body>Facile, non ? 😋
Compatibilité des navigateurs
Comme vous vous en doutez, la balise <body> est compatible avec tous les navigateurs !
En même temps, sans elle... Il n'y aurait plus de page web "standardisée" (qui respecte les standards du W3C).
| Elément | Google Chrome | Safari | Mozilla Firefox | Edge |
| <body> | Oui | Oui | Oui | Oui |