From cbb307d61a12e1f4b8fd9de51d3a91b9ea12d3cc Mon Sep 17 00:00:00 2001 From: Vincent Finance Date: Tue, 2 Apr 2024 23:15:33 +0200 Subject: [PATCH] nouvelle recette: image --- recettes/02-ajouter-une-image.html | 93 ++++++++++++++++++++++++++++++ 1 file changed, 93 insertions(+) create mode 100644 recettes/02-ajouter-une-image.html diff --git a/recettes/02-ajouter-une-image.html b/recettes/02-ajouter-une-image.html new file mode 100644 index 0000000..738ead5 --- /dev/null +++ b/recettes/02-ajouter-une-image.html @@ -0,0 +1,93 @@ + + + + + + + Ajouter une image à une page simple + + +
+ Index des recettes +
+ +
+ +

Ajouter une image à une page simple

+

Ce guide donne les instructions pour creer un simple page web avec un titre, un court contenu et une image.

+ +
+ Une fenetre de navigateur. +
+ +
+ +

Ingrédients pour 1 page web

+ +
    +
  • Un ordinateur fonctionnel
    • +
  • + Un editeur de texte + VSCodium par exemple mais le bloc note du systeme fera l'affaire +
    • +
  • + Un navigateur web + Par exemple Firefox +
    • +
  • + Une image + Le mieux est de prendre une image à vous +
    • +
+ +
+ +
+
+

+ Ouvrir l'editeur de texte et y coller le code HTML suivant. +

+ + 
<!DOCTYPE html>
+<html lang="fr">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Titre</title>
+</head>
+<body>
+    <h1>👋 Salut !</h1>
+    <p>Dites bonjour à mon chat</p>
+    <img src="./monchat.jpg" alt="Une photo de mon chat" />
+</body>
+</html>
+
+ +

Enregistrer le fichier avec un nom finissant par .html quelque part sur l'ordinateur.

+ +

Ouvrir le fichier ainsi créé

+ +

Note : L'actualisation de la page du navigateur est necessaire à chaque modification du code

+
+ +
+

Personnalisation du titre de la page

+ +

Modifier le texte entre la balise <title> et la balise </title>

+
+ +
+

Personnalisation du contenu de la page

+ +

Modifier le titre principal de la page en modifiant le texte entre les balises <h1> et </h2>

+
+ +
+

Pour aller plus loin

+
    +
+
+ +
+ +