0% ont trouvé ce document utile (0 vote)
48 vues2 pages

Cheat Sheet v1

Ce document est une aide-mémoire pour les balises HTML essentielles, incluant la structure de base d'une page, les titres, les paragraphes, les listes, les images et les liens hypertextes. Il fournit des exemples de code pour chaque élément et explique leur utilisation. L'accent est mis sur l'importance de certaines balises et sur les meilleures pratiques, comme l'utilisation de <strong> plutôt que <b> pour le texte en gras.

Transféré par

jonesdev041
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
48 vues2 pages

Cheat Sheet v1

Ce document est une aide-mémoire pour les balises HTML essentielles, incluant la structure de base d'une page, les titres, les paragraphes, les listes, les images et les liens hypertextes. Il fournit des exemples de code pour chaque élément et explique leur utilisation. L'accent est mis sur l'importance de certaines balises et sur les meilleures pratiques, comme l'utilisation de <strong> plutôt que <b> pour le texte en gras.

Transféré par

jonesdev041
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Internet | Création de pages Web | HTML | Cheat Sheet / Aide mémoire HTML

Cheat Sheet / Aide mémoire HTML


Voici un résumé condensé concentré des balises HTML abordées pendant le cours.

Voici une cheat sheet (aide-mémoire) pour les éléments de base du langage HTML.

Structure de base d'une page HTML


1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>Titre de la page</title>
5 </head>
6 <body>
7 <!-- Contenu de la page -->
8 </body>
9 </html>

<!DOCTYPE html> : Déclaration du type de document.


<html> : Balise racine du document HTML.
<head> : Contient des informations sur la page, telles que le titre.
<title> : Définit le titre de la page qui s'affiche dans l'onglet du navigateur.
<body> : Contient le contenu visible de la page.

Titres et paragraphes
1 <h1>Titre de niveau 1</h1>
2 <h2>Titre de niveau 2</h2>
3 <h3>Titre de niveau 3</h3>
4 <h4>Titre de niveau 4</h4>
5 <h5>Titre de niveau 5</h5>
6 <h6>Titre de niveau 6</h6>
7
8 <p>Paragraphe de texte.</p>

<h1> à <h6> : Définit les titres de différents niveaux, <h1> étant le plus important. Un seul titre de niveau 1 sur
la page. Plus d'informations et exemples sur MDN

<p> : Définit un paragraphe de texte. Plus d'informations et exemples sur MDN

Texte en gras
1 <p>Le texte <b>en gras</b>.</p>

<b> : Utilisé pour mettre en évidence du texte en gras.

Note: depuis quelques années, la balise <strong> est préférée à <b>:

1 <p>Le texte <strong>en gras</strong>.</p>

Listes
© 2025 Mr. Lambrechts https://v2.ttrinfo.be 1|2
Liste non ordonnée
C'est la fameuse "boulette liste" 😃

1 <ul>
2 <li>Élément 1</li>
3 <li>Élément 2</li>
4 <li>Élément 3</li>
5 </ul>

<ul> : Définit une liste non ordonnée.

<li> : Élément de liste.

Plus d'informations et exemples sur MDN

Liste ordonnée
1 <ol>
2 <li>Élément 1</li>
3 <li>Élément 2</li>
4 <li>Élément 3</li>
5 </ol>

<ol> : Définit une liste ordonnée.

Plus d'informations et exemples sur MDN

Images
1 <img src="chemin_de_l_image.jpg" alt="Description de l'image">

<img> : Insère une image.


src : Spécifie l'URL de l'image.
alt : Texte alternatif en cas d'indisponibilité de l'image.
Plus d'informations et exemples sur MDN

Pour que l'image prenne 100% de la largeur disponible, on peut lui appliquer la règle CSS suivante:

1 width: 100%;

Liens hypertextes
1 <a href="http://www.exemple.com">Texte affiché</a>

<a> : Crée un lien hypertexte.


href : Spécifie l'URL de destination du lien.
Texte affiché : texte affiché à l'écran.

© 2025 Mr. Lambrechts https://v2.ttrinfo.be 2|2

Vous aimerez peut-être aussi