Alignement de l'image centrale dans Markdown

1. Aligner les images dans Markdown
2. Comment centrer l’alignement dans Markdown

Markdown est populairement connu comme un langage de balisage léger qui inclut des éléments de formatage pour les documents en texte brut à l’aide d’une application d’éditeur de texte. Il a été créé par John Gruber en 2004.

Ce langage est devenu le langage de balisage le plus demandé au monde. On trouve aujourd’hui de nombreuses applications web qui sont notamment utilisées pour écrire en Markdown.

Markdown est légèrement différent d’un éditeur WYSIWYG. Comme on le voit dans Microsoft Word pour le formatage des mots et des phrases, nous cliquons sur les boutons pour voir les changements immédiatement.

Mais Markdown ne suit pas cela. Dans Markdown, lorsque nous développons un fichier au format Markdown, la syntaxe Markdown spécifie certains mots et expressions qui doivent être différents dans le texte.

Cet article explique comment centrer une image dans notre fichier Markdown. Par exemple, le fichier README.md à la racine d’un projet open source s’affiche sur le navigateur au format HTML.

Aligner les images dans Markdown

Markdown a un moyen très simple d’écrire du contenu sans utiliser la surcharge de formatage avec un éditeur WYSIWYG.

Écrire du texte dans Markdown est rapide, mais qu’en est-il de l’alignement des images ?

Les balises d’image Markdown elles-mêmes n’ont aucune propriété d’alignement, ce qui est très ennuyeux lorsque nous formatons notre fichier README.md sur Github.

<!-- No alignment options -->
(/myimages/mylogo.png)

Heureusement, il existe une solution à ce problème. Nous utiliserons des balises d’image html pour améliorer nos documents en utilisant la balise img en HTML.

.md est l’extension markdown qui nous indique que le README.md est un fichier de démarquage. Ce fichier est utilisé pour créer le résumé html que nous voyons à la fin de nos projets.

<img align="right" width="120" height="120" src="https://www.pexels.com/photo/photo-of-grey-tabby-kitten-lying-down-2558605/">

Comment centrer l’alignement dans Markdown

L’alignement central dans le démarquage est un peu délicat. Comme indiqué ci-dessous, nous devons envelopper la balise img dans une balise p.

<p align="center">
  <img width="460" height="300" src="https://www.pexels.com/photo/photo-of-grey-tabby-kitten-lying-down-2558605/">
</p>