Exemples de base HTML
Dans ce chapitre, nous montrerons quelques exemples HTML de base.
Ne vous inquiétez pas si nous utilisons des balises que vous n'avez pas encore apprises.
Documents HTML
Tous les documents HTML doivent commencer par une déclaration de type de document : <!DOCTYPE html>
.
Le document HTML lui-même commence par <html>
et se termine par </html>
.
La partie visible du document HTML est comprise entre <body>
et </body>
.
Exemple
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
La déclaration <!DOCTYPE>
La <!DOCTYPE>
déclaration représente le type de document et aide les navigateurs à afficher correctement les pages Web.
Il ne doit apparaître qu'une seule fois, en haut de la page (avant toute balise HTML).
La <!DOCTYPE>
déclaration n'est pas sensible à la casse.
La <!DOCTYPE>
déclaration pour HTML5 est :
<!DOCTYPE html>
En-têtes HTML
Les titres HTML sont définis avec les balises <h1>
to .<h6>
<h1>
définit la rubrique la plus importante. <h6>
définit la rubrique la moins importante :
Exemple
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
Paragraphes HTML
Les paragraphes HTML sont définis avec la <p>
balise :
Exemple
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
Liens HTML
Les liens HTML sont définis avec la <a>
balise :
Exemple
<a href="https://www.w3schools.com">This is a link</a>
La destination du lien est spécifiée dans l' href
attribut.
Les attributs sont utilisés pour fournir des informations supplémentaires sur les éléments HTML.
Vous en apprendrez plus sur les attributs dans un chapitre ultérieur.
Images HTML
Les images HTML sont définies avec la <img>
balise.
Le fichier source ( src
), le texte alternatif ( alt
),
width
et height
sont fournis en tant qu'attributs :
Exemple
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
Comment afficher la source HTML ?
Avez-vous déjà vu une page Web et vous êtes-vous demandé « Hé ! Comment ont-ils fait ça ?
Afficher le code source HTML :
Faites un clic droit dans une page HTML et sélectionnez "Afficher la source de la page" (dans Chrome) ou "Afficher la source" (dans Edge), ou similaire dans d'autres navigateurs. Cela ouvrira une fenêtre contenant le code source HTML de la page.
Inspectez un élément HTML :
Faites un clic droit sur un élément (ou une zone vide), et choisissez "Inspecter" ou "Inspecter l'élément" pour voir de quels éléments sont constitués (vous verrez à la fois le HTML et le CSS). Vous pouvez également modifier le code HTML ou CSS à la volée dans le panneau Éléments ou Styles qui s'ouvre.