Comprendre un code HTML
Comment lire ce code?
Les éléments entre crochets sont appelés balises. Ils se terminent quand le nom de la balise est précédé par un “/”. Exemple: balise head (ouverture de la balise); balise /head (fermeture de la balise)
!DOCTYPE html détermine le type du fichier, ici c’est du HTML qui est utilisé principalement pour la création de pages Web.
html lang=”fr” ,comme vous pouvez l’imaginer, cela sert à définir la langue du fichier html.
Ensuite, il y a une balise head. La balise head fournit des informations générales sur le document.
Dans cette balise, on trouve le “type d’encodage” : charset ainsi que ce qu’on appelle le “jeu d’encodage” : “utf-8”.
De plus, on trouve la balise title permettant de donner un titre à la page (c’est le nom qu’il y aura sur l’onglet de la page Web).
Passons à la dernière ligne de code de la balise head:
- link rel=”stylesheet” permet d’importer un fichier CSS pour la mise en forme du site
- href = “Journée_Portes_Ouvertes.css” est le nom du fichier CSS permettant de modifier la mise en forme du site
Que signifie cette partie du code ?
La balise body annonce la partie du corps du site.
Ensuite, la balise header annonce la partie haute de la "boite" dans laquelle elle est. Par exemple, si le header est dans une section, cela correspond à la partie haute de la section. Ici, dans le body, cela correspond plus à une entête de page.
La balise h1 annonce un titre d'importance 1. Il y a aussi une balise h2 qui est donc un titre d'importance 2, donc moins important que le h1.
La balise section est une "boite" qui permet de structurer la page.
La balise ul est une liste dont les éléments sont notés avec la balise li.
Comprendre un code CSS
Que signifie ce code ?
Pour modifier le style des balises, on rentre le nom de la balise puis on ouvre des accolades et on rentre les modifications de style que l'on veut effectuer.
Ici dans le code css on a rentré la commande background-color qui permet de modifier la couleur d'arriere plan de la balise choisie, il est dans la balise html donc l'arriere plan de la page sera en bleu clair.
Ensuite dans la balise body il y a la commande color qui permet de modifier la couleur d'écriture
Il existe des milliers d'autres commandes CSS, comme text-align pour aligner le texte, font-size pour modifier la taille des caractères
Exercice
Si vous voulez découvrir comment manipuler un code HTML, voici un exercice concocté pour vous:
Je me lance