HTML Exemples de Base
Dans ce chapitre, nous allons présenter quelques exemples de base en HTML.
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 se trouve entre <body> et </body> .
Exemple
<!DOCTYPE html>
<html>
<body>
<h1>Mon Premier Titre</h1>
<p>Mon premier paragraphe.</p>
</body>
</html> La Déclaration <!DOCTYPE>
La déclaration <!DOCTYPE> représente le type de document et aide les navigateurs à afficher les pages web correctement.
Elle ne doit apparaître qu'une seule fois, en haut de la page (avant toute balise HTML).
La déclaration <!DOCTYPE> n'est pas sensible à la casse.
La déclaration <!DOCTYPE> pour HTML5 est :
<!DOCTYPE html> Titres HTML
Les titres HTML sont définis avec les balises <h1> à <h6> .
<h1> définit le titre le plus important, tandis que <h6> définit le titre le moins important :
Exemple
<h1>Ceci est le titre 1</h1>
<h2>Ceci est le titre 2</h2>
<h3>Ceci est le titre 3</h3> Paragraphes HTML
Les paragraphes HTML sont définis avec la balise <p> :
Exemple
<p>Ceci est un paragraphe.</p>
<p>Ceci est un autre paragraphe.</p> Liens HTML
Les liens HTML sont définis avec la balise <a> :
Exemple
<a href="https://www.formation-ti.org">Ceci est un lien</a> La destination du lien est spécifiée dans l'attribut href .
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 balise <img> .
Le fichier source ( src ), le texte alternatif ( alt ), width , et height sont fournis en tant qu'attributs :
Exemple
<img src="formation-ti.org.jpg" alt="formation-ti.org" width="104" height="142"> Comment Voir le Code Source HTML
Avez-vous déjà vu une page Web et vous êtes demandé : "Hé ! Comment ont-ils fait ça ?"
Voir le Code Source HTML :
Cliquez sur CTRL + U dans une page HTML, ou faites un clic droit sur la page et sélectionnez "Afficher le Code Source de la Page". Cela ouvrira un nouvel onglet contenant le code source HTML de la page.
Inspecter un Élément HTML :
Faites un clic droit sur un élément (ou une zone vide), et choisissez "Inspecter" pour voir de quoi sont composés les éléments (vous verrez à la fois le HTML et le CSS). Vous pouvez également modifier le HTML ou le CSS à la volée dans le panneau Éléments ou Styles qui s'ouvre.