HTML
</>
Formateur: Fabio Ginja
HTML
Définition
L'HyperText Markup Language n'est pas un langage de programmation mais un langage de balise. Il permet de structurer sémantiquement le contenu d'une page, d'y insérer des textes, des images, ou du contenu multimédia.
Une balise est définie comme suit:
<p> Hello World </p>
Balise ouvrante
Balise fermante
Contenu
Il existe également des balises dites vides, auto-fermantes (vestige), ou encore orphelines:
<img src="url.com/image.jpg" alt="logo">
<img src="url.com/image.jpg" alt="logo" />
src et alt sont des attributs de la balise img.
Imbrication
Les balises peuvent s'imbriquer les unes dans les autres, cependant, la dernière balise ouverte doit être la première à être fermée:
<p> Hello <em>World</em> </p>
<p> Hello <em>World</p> </em>
Structure
Toute page html doit avoir certaines balises. La première est la balise Doctype qui va spécifier au navigateur que l'on utilise de l'html. L'élément html est notre élément racine. head va nous permettre de spécifier ce qui ne sera "visible" dans le corps de notre page web (script, css, encodage...). Le body sera le contenu de notre page.
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Titre dans l'onglet</title>
</head>
<body>
<h1>Titre sur ma page</h1>
</body>
</html>
L'indentation est primordiale pour bien s'y retrouver lorsque l'on écrit du code.
Liste des balises
On trouvera une excellente source de documentation sur le site de Mozilla:
Éditeur de texte
Au sein de cette formation, on utilisera Visual Studio Code:
Tips and Tricks:
https://code.visualstudio.com/docs/getstarted/tips-and-tricks
Emmet Cheat Sheet:
HTML
By Fabio Ginja
HTML
Slides de formation Novembre 2019
- 220