Tutoriel HTML

ACCUEIL HTML Introduction HTML Éditeurs HTML HTML de base Éléments HTML Attributs HTML En-têtes HTML Paragraphes HTML Styles HTML Formatage HTML Citations HTML Commentaires HTML Couleurs HTML HTMLCSS Liens HTML Images HTML Icône de favori HTML Tableaux HTML Listes HTML Bloc HTML et Inline Cours HTML Identifiant HTML Iframes HTML HTMLJavaScript Chemins d'accès aux fichiers HTML Tête HTML Mise en page HTML HTML réactif Code informatique HTML Sémantique HTML Guide de style HTML Entités HTML Symboles HTML Émojis HTML Jeu de caractères HTML Encodage d'URL HTML HTML contre XHTML

Formulaires HTML

Formulaires HTML Attributs de formulaire HTML Éléments de formulaire HTML Types d'entrée HTML Attributs d'entrée HTML Attributs du formulaire de saisie HTML

Graphiques HTML

Canevas HTML HTML SVG

Médias HTML

Médias HTML Vidéo HTML Audio HTML Modules externes HTML YouTube HTML

API HTML

Géolocalisation HTML Glisser/déposer HTML Stockage Web HTML Travailleurs Web HTML HTML SSE

Exemples HTML

Exemples HTML Questionnaire HTML Exercices HTML Certificat HTML Résumé HTML Accessibilité HTML

Références HTML

Liste de balises HTML Attributs HTML Attributs globaux HTML Prise en charge du navigateur HTML Événements HTML Couleurs HTML Canevas HTML HTML Audio/Vidéo Doctypes HTML Jeux de caractères HTML Encodage d'URL HTML Codes de langue HTML Messagerie HTTP Méthodes HTTP Convertisseur PX en EM Raccourcis clavier

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' hrefattribut. 

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), widthet heightsont 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.