BALISES HTML

BaliseCodeRenduDescription
<!DOCTYPE> <!DOCTYPE html> Déclaration du type de document HTML
<html> <html lang="fr">...</html> ... Élément racine du document
<head> <head>...</head> ... Conteneur des métadonnées
<title> <title>Titre</title> Titre Titre affiché dans l'onglet
<meta> <meta charset="ISO-8859-1"> Métadonnées (charset, description...)
<link> <link rel="stylesheet" href="style.css"> Lien vers une ressource externe
<style> <style>/* CSS */</style> Feuille de style interne
<body> <body>...</body> ... Conteneur du contenu visible
<header> <header>...</header>
...
 En-tête de page ou de section
<nav> <nav>...</nav> Zone de navigation
<main> <main>...</main>
...
 Contenu principal de la page
<section> <section>...</section>
...
 Section thématique
<article> <article>...</article>
...
 Contenu autonome (article)
<aside> <aside>...</aside> Contenu secondaire, sidebar
<footer> <footer>...</footer>
...
 Pied de page ou de section
<h1>...<h6> <h2>Titre</h2>

Titre

 Titres de niveau 1 à 6
<p> <p>Paragraphe</p>

Paragraphe

 Paragraphe de texte
<br> Ligne<br>suivante Ligne
suivante		 Saut de ligne
<hr> <hr>
Rupture thématique (ligne horizontale)
<a> <a href="#">Lien</a> Lien Lien hypertexte
<img> <img src="images/image_par_defaut.png" alt="image"> image Image intégrée
<ul>, <ol>, <li> <ul><li>Élément</li></ul>
  • Élément
 Listes non ordonnée, ordonnée, items
<dl>, <dt>, <dd> <dl><dt>Terme</dt><dd>Définition</dd></dl>
Terme
Définition
 Liste de définitions
<table>, <tr>, <td>, <th> <table><tr><td>Cellule</td></tr></table>
Cellule
 Table de données
<form> <form action="#">Formulaire</form>
Formulaire
 Formulaire de saisie
<input> <input type="text"> Champ de formulaire
<textarea> <textarea>Texte</textarea> Zone de texte multilignes
<button> <button>OK</button> Bouton cliquable
<select>, <option> <select><option>Choix</option></select> Liste déroulante
<label> <label>Texte<input></label> Label associé ˆ un champ
<fieldset>, <legend> <fieldset><legend>Groupe</legend></fieldset>
Groupe
 Regroupement semi-légendé
<div> <div>...</div>
...
 Division générique de bloc
<span> <span>...</span> ... Grep générique en ligne
<strong> <strong>Important</strong> Important Emphase forte
<em> <em>Italique</em> Italique Emphase
<b> <b>Gras</b> Gras Texte en gras (présentation)
<i> <i>Italique</i> Italique Texte en italique (présentation)
<u> <u>Souligné</u> Souligné Texte souligné
<small> <small>Petit</small> Petit Texte plus petit
<sub> E=mc<sub>2</sub> E=mc2 Indice
<sup> x<sup>2</sup> x2 Exposant
<code> <code>...</code> ... Texte monospacé pour code
<pre> <pre>...</pre> 
...
 Texte préformaté
<samp> <samp>...</samp> ... Exemple de sortie de programme
<kbd> <kbd>Ctrl</kbd> Ctrl Entrée clavier
<var> <var>x</var> x Variable mathématique ou code
<mark> <mark>Important</mark> Important Texte surligné
<abbr> <abbr title="HyperText Markup Language">HTML</abbr> HTML Abréviation
<time> <time datetime="2025-07-16">16 juillet 2025</time> Date/heure
<details>, <summary> <details><summary>Voir</summary>É</details>
VoirÉ
 Détail repliable
<figure>, <figcaption> <figure><img><figcaption>Légende</figcaption></figure>
Légende
 Figure avec légende
<audio> <audio controls src="demo/wave.mp3"></audio> Audio intégré
<video> <video controls src="demo/wave.mp4"></video> Vidéo intégrée
<source> <source src="demo/wave.mp4" type="video/mp4"> Source multimédia pour audio/vidéo
<canvas> <canvas>...</canvas> ... Zone graphique scriptable
<iframe> <iframe src="demo/index.php"></iframe> Cadre imbriqué
<embed> <embed src="demo/wave.swf"> Contenu externe embarqué
<object> <object data="demo/wave.swf"></object> Objet embarqué
<map>, <area> <map name="m"><area shape=É></map> Carte d'image cliquable
<svg> <svg>...</svg> ... Graphique vectoriel SVG
<template> <template>...</template> Modèle HTML non rendu
<script> <script>...</script> Script client (JavaScript)
<noscript> <noscript>No JS</noscript> Message si JS désactivé
<style> <style>...</style> Styles internes CSS
<meta> <meta charset> Métainformations
Retour
Accueil