Guide Markdown - Bases
Cet article propose un échantillon des syntaxes de base du Markdown qui peut être utilisé dans vos articles. Il ne s’agit pas d’une liste exhaustive de toutes les syntaxes Markdown, mais plutôt d’un guide de référence rapide pour les éléments les plus couramment utilisés.
En-têtes
Les éléments HTML <h1> à <h6> représentent six niveaux de titres de section. <h1> est le niveau le plus élevé tandis que le <h6> est le plus bas.
Code :
# Titre H1
## Titre H2
### Titre H3
#### Titre H4
##### Titre H5
###### Titre H6
Résultat :
Titre H1
Titre H2
Titre H3
Titre H4
Titre H5
Titre H6
Paragraphes
Un paragraphe est simplement une ligne ou un groupe de lignes de texte, séparé par une ou plusieurs lignes vides.
Code :
Un paragraphe.
Un autre paragraphe.
Résultat :
Un paragraphe.
Un autre paragraphe.
Retours à la ligne
Par défaut, les retours à la ligne sont ignorés dans le Markdown. Par exemple :
Code :
Ceci est la première ligne.
Ceci est la seconde ligne.
Résultat :
Ceci est la première ligne. Ceci est la seconde ligne.
Un retour à la ligne est créé en terminant une ligne avec deux espaces ou plus.
Code :
Ceci est la première ligne.
Ceci est la seconde ligne.
Résultat :
Ceci est la première ligne.
Ceci est la seconde ligne.
Styles de texte
- Le tableau ci-dessous montre les styles de texte de base.
| Style | Code | Résultat |
|---|---|---|
| Italique | *Texte* ou _Texte_ | Texte ou Texte |
| Gras | **Texte** | Texte |
| Gras et Italique | ***Texte*** | Texte |
| Barré | ~~Texte~~ | |
| Code inline | `Texte` | Texte |
Sur la plupart des applications de rendu Markdown, y compris en hugo (donc sur ce site), il est possible d’utiliser des balises HTML pour styliser le texte.
| Style | Code | Résultat |
|---|---|---|
| Italique | <em>Texte</em> | Texte |
| Gras | <strong>Texte</strong> | Texte |
| Barré | <del>Texte</del> |
Cela vaut aussi pour certains mots clés et balises, comme les abréviations, les éléments de formulaire, etc.
| Style | Code | Résultat |
|---|---|---|
| Souligné | <u>Texte</u> | Texte |
| Surligné | <mark>Texte</mark> | Texte |
| Saisie clavier | <kbd>Ctrl</kbd> + <kbd>C</kbd> | Ctrl + C |
| Abréviation | <abbr title="Graphics Interchange Format">GIF</abbr> | GIF |
| Exposant | X<sup>n</sup> | Xn |
| Indice | H<sub>2</sub>O | H2O |
| Espace insécable | |
Liens
Les liens sont créés en entourant le texte du lien entre crochets [], suivi de l’URL entre parenthèses ().
Code :
Voici un lien : [ENSEIRB-MATMECA](https://enseirb-matmeca.bordeaux-inp.fr)
Résultat :
Voici un lien : ENSEIRB-MATMECA
Listes
Listes ordonnées
Code :
1. Première point
2. Second point
3. Troisième point
Résultat :
- Première point
- Second point
- Troisième point
Listes non ordonnées
Code :
- Element de la liste
- Autre élément
- Et un autre élément
Résultat :
- Element de la liste
- Autre élément
- Et un autre élément
Listes imbriquées
Code :
- Fruit
- Pomme
- Orange
- Banane
- Selle
- Lait
- Fromage
Résultat :
- Fruit
- Pomme
- Orange
- Banane
- Selle
- Lait
- Fromage
Listes de tâches
En ajoutant des crochets [] devant les éléments de la liste, vous pouvez créer une liste de tâches. En ajoutant un x entre les crochets [x], vous pouvez marquer une tâche comme terminée.
Les cases à cocher des listes de tâches ne sont pas interactives. Elle servent uniquement à indiquer au lecteur la progression d’une liste de tâches à un instant donné.
Code :
- [x] Tâche 1
- [ ] Tâche 2
- [ ] Tâche 3
Résultat :
- Tâche 1
- Tâche 2
- Tâche 3
Commentaires
Il est possible d’ajouter des commentaires dans votre Markdown en utilisant la syntaxe HTML des commentaires <!-- Commentaire -->. Ces commentaires ne seront pas affichés dans le rendu final de la page.
Code :
Voici du texte visible. <!-- Ceci est un commentaire qui ne sera pas affiché. -->
Résultat :
Voici du texte visible.
Ceci marche aussi sur plusieurs lignes
Code :
Voici du texte visible.
<!-- # Titre invisible
Personne ne saura jamais ce que c'est.
Dommage ! -->
Résultat :
Voici du texte visible.