Mémento
Mémento
Les balises de premier niveau sont les principales balises qui structurent une page HTML. Elles sont indispensables pour réaliser le « code minimal » d'une page web.
Balise |
Description |
<html> |
Balise principale |
<head> |
En-tête de la page |
<body> |
Corps de la page |
Code minimal d'une page HTML :
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Titre</title> </head>
<body>
</body> </html> |
Ces balises sont toutes situées dans l'en-tête de la page web, c'est-à-dire entre <head> et </head> :
Balise |
Description |
<link /> |
Liaison avec une feuille de style |
<meta /> |
Métadonnées de la page web (charset, mots-clés, etc.) |
<script> |
Code JavaScript |
<style> |
Code CSS |
<title> |
Titre de la page |
Balise |
Description |
<abbr> |
Abréviation |
<blockquote> |
Citation (longue) |
<cite> |
Citation du titre d'une œuvre ou d'un évènement |
<q> |
Citation (courte) |
<sup> |
Exposant |
<sub> |
Indice |
<strong> |
Mise en valeur forte |
<em> |
Mise en valeur normale |
<mark> |
Mise en valeur visuelle |
<h1> |
Titre de niveau 1 |
<h2> |
Titre de niveau 2 |
<h3> |
Titre de niveau 3 |
<h4> |
Titre de niveau 4 |
<h5> |
Titre de niveau 5 |
<h6> |
Titre de niveau 6 |
<img /> |
Image |
<figure> |
Figure (image, code, etc.) |
<figcaption> |
Description de la figure |
<audio> |
Son |
<video> |
Vidéo |
<source> |
Format source pour les balises <audio> et <video> |
<a> |
Lien hypertexte |
<br /> |
Retour à la ligne |
<p> |
Paragraphe |
<hr /> |
Ligne de séparation horizontale |
<address> |
Adresse de contact |
<del> |
Texte supprimé |
<ins> |
Texte inséré |
<dfn> |
Définition |
<kbd> |
Saisie clavier |
<pre> |
Affichage formaté (pour les codes sources) |
<progress> |
Barre de progression |
<time> |
Date ou heure |
Cette section énumère toutes les balises HTML permettant de créer des listes (listes à puces, listes numérotées, listes de définitions…)
Balise |
Description |
<ul> |
Liste à puces, non numérotée |
<ol> |
Liste numérotée |
<li> |
Élément de la liste à puces |
<dl> |
Liste de définitions |
<dt> |
Terme à définir |
<dd> |
Définition du terme |
Balise |
Description |
<table> |
Tableau |
<caption> |
Titre du tableau |
<tr> |
Ligne de tableau |
<th> |
Cellule d'en-tête |
<td> |
Cellule |
<thead> |
Section de l'en-tête du tableau |
<tbody> |
Section du corps du tableau |
<tfoot> |
Section du pied du tableau |
Balise |
Description |
<form> |
Formulaire |
<fieldset> |
Groupe de champs |
<legend> |
Titre d'un groupe de champs |
<label> |
Libellé d'un champ |
<input /> |
Champ de formulaire (texte, mot de passe, case à cocher, bouton, etc.) |
<textarea> |
Zone de saisie multiligne |
<select> |
Liste déroulante |
<option> |
Élément d'une liste déroulante |
<optgroup> |
Groupe d'éléments d'une liste déroulante |
Ces balises permettent de construire le squelette de notre site web.
Balise |
Description |
<header> |
En-tête |
<nav> |
Liens principaux de navigation |
<footer> |
Pied de page |
<section> |
Section de page |
<article> |
Article (contenu autonome) |
<aside> |
Informations complémentaires |
Les balises génériques sont des balises qui n'ont pas de sens sémantique.
En effet, toutes les autres balises HTML ont un sens : <p> signifie « Paragraphe », <h2> signifie « Sous-titre », etc.
Parfois, on a besoin d'utiliser des balises génériques (aussi appelées balises universelles) car aucune des autres balises ne convient. On utilise le plus souvent des balises génériques pour construire son design.
Il y a deux balises génériques : l'une est inline, l'autre est block.
Balise |
Description |
<span> |
Balise générique de type inline |
<div> |
Balise générique de type block |
Ces balises ont un intérêt uniquement si vous leur associez un attribut class, id ou style :
Ces trois attributs ne sont pas réservés aux balises génériques : vous pouvez aussi les utiliser sans aucun problème dans la plupart des autres balises.
Créé avec HelpNDoc Personal Edition: Générateur complet d'aides multi-formats