added fragments + conf

docs/dev/fragments/html/04-image.md

@@ -0,0 +1,35 @@
+# Image
+
+## Description
+
+Afin d'insérer une image dans son document, il convient d'utiliser la balise `<img>`. Cette dernière est particulière car elle n'a pas besoin de balise dite “fermante”
+
+C'est une balise qui fait partie de la famille des [“Éléments remplacés”.](https://developer.mozilla.org/fr/docs/Web/CSS/Replaced_element)
+
+Cette balise nécessite deux attributs obligatoires: `src` et `alt` et deux attributs recommandés: `width` et `height`.
+
+L'attribut `src` nous permet de renseigner la source de l'image. Que ce soit une URL distante ou bien un chemin vers une image locale.
+
+L'attribut `alt` est à renseigner si l'image est “porteuse de sens”. Si l'image est décorative, l'attribut `alt` doit rester vide mais ne doit pas être supprimé.
+
+Les attributs `width` et `height` sont à renseigner dans la mesure du possible afin que le navigateur réserve la place nécessaire à l'image au moment du chargement de la page.
+
+## Exemples
+
+```html
+<img
+  src="./images/banniere-promo.jpg"
+  alt="Économisez 40% avec le code BIENVENUE"
+  width="600"
+  height="60"
+/>
+```
+
+```html
+<img
+  src="https://photos-de-chats.fr/felix.png"
+  alt=""
+  width="300"
+  height="400"
+/>
+```