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>.
<!DOCTYPE html>
<html>
<body>
Exemple: Voir VSC
<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 page
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>
Titres HTML
Les en-têtes HTML sont définis avec les balises <h1> to <h6>
<h1> définit le titre le plus important. <h6> définit le titre le moins
important :
Exemple: <h1>This is heading 1</h1> Voir VSC
<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> Voir VSC
<p>This is another paragraph.</p>
Liens HTML:
Les liens HTML sont définis avec la <a>balise:
<a href="https://www.w3schools.com">This is a link</a>
Exemple: Voir VSC
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 davantage 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
comme attributs :
<img src="image1.jpg" width="300px" height="142" />
Exemple: Voir VSC
Afficher le code source
Comment afficher la source HTML :
HTML
Cliquez sur Ctrl + U dans une
Avez-vous déjà vu une page page HTML, ou faites un clic
Web et vous êtes-vous droit dessus et sélectionnez
demandé : « Hé ! Comment ont- « Afficher le code source ».
ils fait ça ? » Un nouvel onglet contenant
le code source HTML de la
page s'ouvrira.
Inspecter un élément HTML :
Faites un clic droit sur un élément
(ou une zone vide) et choisissez
« Inspecter » pour voir de quoi il est
composé (vous verrez à la fois le
code HTML et le code CSS). Vous
pouvez également modifier le code
HTML ou le code CSS à la volée dans
le panneau « Éléments » ou
« Styles » qui s'ouvre.
Éléments HTM
L
Un élément HTML est défini par une balise de début, du contenu et une
balise de fin.
Éléments HTML:
L' élément HTML est tout, de la balise de début à la balise de fin :
< tagname > Le contenu va ici... < /tagname >
Exemples de quelques éléments HTML :
< h1 > Mon premier titre < /h1 >
< p > Mon premier paragraphe. < /p >
Start tag Element content End tag
<h1> My First Heading </h1>
<p> My first paragraph. </p>
<br> none none
Remarque : Certains éléments HTML n'ont aucun contenu (comme l'élément <br>).
Ces éléments sont appelés éléments vides. Ils n'ont pas de balise de fin !
Éléments HTML imbriqués
Les éléments HTML peuvent être imbriqués (cela signifie que les éléments peuvent contenir d'autres éléments).
Tous les documents HTML sont constitués d’éléments HTML imbriqués.
L'exemple suivant contient quatre éléments HTML ( <html>, <body>, <h1> et <p>) :
<!DOCTYPE html>
<html>
<body>
Exemple:
<h1>My First Heading</h1>
Voir VSC
<p>My first paragraph.</p>
</body>
</html>
Exemple expliqué
L' <html>élément est l'élément racine et il définit l'ensemble du document
HTML.
Il a une balise de début <html>et une balise de fin </html>.
Ensuite, à l'intérieur de l' <html>élément, il y a un <body> élément :
<body>
L' <body>élément définit le corps du document.
<h1>My First Heading</h1>
<p>My first paragraph.</p> Il a une balise de début <body>et une balise de fin </body>.
Ensuite, à l'intérieur de l' <body>élément, il y a deux autres éléments : <h1>et <p>
</body>
L' <h1>élément définit un titre.
Il a une balise de début <h1>et une balise de fin </h1>:
<h1>My First Heading</h1>
<h1>My First Heading</h1>
<p>My first paragraph.</p> L' <p>élément définit un paragraphe.
Il a une balise de début <p>et une balise de fin </p>:
<p>My first paragraph.</p>
léments HTML vides
es éléments HTML sans contenu sont appelés éléments vides.
a <br>balise définit un saut de ligne et est un élément vide sans balise de fermeture :
Exemple: <p>This is a <br> paragraph with a line break.</p> Voir VSC
Le HTML n'est pas sensible à la casse
Les balises HTML ne sont pas sensibles à la casse : <P>signifie la même chose
que <p>.
