Web
HTML
Cours
Les balises HTML
La balise <p> :
La balise <p> pour Paragraphe, encadre le contenu et l’affiche sous forme de paragraphe sur la page Web.
La balise <br> :
La balise <br> se suffit à elle-même (orpheline), elle permet de revenir à la ligne sur l’affichage de la page Web.
La balise <h1> :
La balise <h1> encadre le contenu et l’affiche sous la forme d’un titre plus ou moins gros sur la page Web.
La balise <a> :
La balise <a> encadre un contenu et lui applique un lien vers une destination. Ce lien est à renseigner en
paramètre de la balise avec « href ».
balises_HTML.odt 1/4 26/11/24 - v1 B . Mathey
Web
HTML
Cours
La balise <img> :
La balise <img> pour Image est une balise orpheline. Pour fonctionner elle doit nécessairement avoir le
paramètre « src » renseignant l’adresse web ou le chemin vers l’emplacement de l’image à afficher. Le
paramètre « alt » est une description facultative de l’image mais est une bonne pratique en cas de
problème d’affichage ou pour les malvoyants.
La balise <ul> et <ol> :
Les balises <ul> pour UNORDERED LIST et <ol> pour ORDERED LIST fonctionnent de la même manière, seul
l’affichage sur la page web change. Elles servent à afficher une liste à puce numérotée ou non numérotée. La
balise <li> sert à ajouter une nouvelle ligne dans cette liste.
balises_HTML.odt 2/4 26/11/24 - v1 B . Mathey
Web
HTML
Cours
La balise <table> :
On ouvre la balise <table> pour indiquer que nous voulons créer un tableau. Deux choses caractérises un
tableau, les lignes et les colonnes.
La balise <tr> pour TABLE ROW, permet d’ajouter une ligne au tableau, pour afficher 3 lignes dans votre
tableau il faudra donc avoir 3 balises <tr>.
La balise <td> permet d’ajouter une cellule (colonne) dans la ligne <tr> où elle se trouve. Pour afficher 4
colonnes ils faut donc mettre 4 balises <td> dans chaque ligne du tableau. Si vous n’avez pas le même
nombre de cellules dans chaque ligne, votre tableau risque d’avoir de petits problèmes de mise en page.
Ces trois balises sont des balises qui encadrent un contenu, il faut donc les ouvrir et les fermer au bon
endroit !
Recherche mots-clés :
Il existe une multitude d’autres balises HTML possibles. Pour vous entraîner à faire des recherches, voici un
exemple de mots-clés à écrire dans votre moteur de recherche pour les trouver.
- Mémento balises HTML
balises_HTML.odt 3/4 26/11/24 - v1 B . Mathey
Web
HTML
Cours
Quelques balises de structuration de texte :
Tester ces balises et observez l’effet produit. N’oubliez pas les balises fermantes quand nécessaires.
<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
<mark> : Mise en valeur visuelle
<figure> : Figure (image, code, etc.)
<figcaption> : Description de la figure
<audio> : Son
<video> : Vidéo
<source> : Format source pour les balises<audio>et<video>
<hr /> : Ligne de séparation horizontale
<address> : Adresse de contact
<del> : Texte supprimé
<ins> : Texte inséré
<dfn> : Définition
<pre> : Affichage formaté (pour les codes sources)
<progress> : Barre de progression
<time> : Date ou heure
balises_HTML.odt 4/4 26/11/24 - v1 B . Mathey