Markdown

Dans un moteur de recherche, taper : « markdown cheat sheet ».

Caractère

  • _texte_ ou *texte* : pour mettre en italique
  • __texte__ ou **texte** : mettre en gras
  • *__Texte__* ou **_Texte_** : pour combiner gras et italique texte
  • `code` : pour un morceau de code en ligne (au milieu d’une phrase) : touche AltGr+7
  • [github](https://github.com/) : lien URL vers un site web

Retour à la ligne

  • deux espaces en fin de ligne : pour faire un ‘retour à la ligne’ (sans passer de ligne).
  • appuyer 2 fois sur ENTRER : pour faire un ‘retour à la ligne’ et passer une ligne.
  • > : pour un bloc de citation ou un bilan-résumé (Blockquote)
  • *** ou ___ : insère une ligne horizontale de séparation ( 3 underscores ou étoiles)

Bloc de code Python

```python ou une indentation (tabulation ou 4 espaces) : pour bloc de code (plusieurs lignes)

```python
print("Bonjour")
```

Code & blockquote

> ```python
> x = np.linspace(a, b, N)  # une matrice contenant N réels régulièrement espacés
> y = f(x)  # images de x
> plt.plot(x, y)
> plt.show()
> ```

Titre

  • # gros titre : titre de niveau 1
  • ## moyen titre : titre de niveau 2
  • ### petit titre : titre de niveau 3

Liste

  • * ou + ou - : devant les items d’une liste non ordonnée (à puces).
  • 1. : devant les items d’une liste ordonnée (numérotée)
  • une indentation (tabulation ou 4 espaces) : pour une sous-liste
1. item A
    1. sous-item A1
    1. sous-item A2
1. item B
    * sous item non numéroté
aperçu d'une liste en Markdown
fig : aperçu d’une liste en Markdown

Tableau

| unité informatique | octets | bits |
|----------|-------------|-----|
| 1 octet  |  1 octet | 8 bits |
| 1 ko  |1024 octets | 8 192 bits|
| 1 Mo | 1024 Ko (1 048 576 octets) | 8 388 608 bits |
aperçu d'un tableau en Markdown
fig : aperçu d’un tableau en Markdown

Image

En markdown

Les images ont la même balise qu’un lien URL avec un point d’exclamation.

  • ![machine de Turing en Lego](https://fr.wikipedia.org/wiki/Fichier:Lego_Turing_Machine.jpg) : pour une image d’internet
  • ![mon image](img/monImage.jpg) : pour une image du répertoire voisin

En revanche, on ne peut pas changer la taille d’une image, il faut la dimensionner correctement dans un logiciel éditeur d’image.

En balise HTML

Pour redimensionner une image, il faut utiliser une balise HTML d’image.

Pour une image attachée

Exemple sur une image attachée :

<img src="attachment:a5b9f993-1214-44a6-bbc7-86118a433da0.png"
 style="margin: auto;" width="300" alt="pomme">

Sans attacher l’image

Pour insérer le code de l’image PNG ou JPG directement dans la cellule, il faut passer l’image en base 64. Ce petit programme Python permet d’obtenir le code de l’image en base 64 :

import base64
with open("dichotomie_pomme.png", "rb") as f:
    data = base64.b64encode(f.read()).decode()
print(data)

Ensuite on insère le code ainsi :

PNG: <img src="data:image/png;base64,iVBOR....kJggg=="
 style="margin: auto;" width="300" alt="pomme">

JPG: <img src="data:image/jpg;base64,iVBOR....kJggg=="
 style="margin: auto;" width="300" alt="pomme">

Image SVG

Les fichiers SVG sont volontairement bloqués car certaines balises sont considérées « à risque ». Pour les afficher, il faut sanitizer le code SVG sur un site d’encodage https://www.urlencoder.org/

Ensuite, on insère comme ceci :

![Etoile](data:image/svg+xml,%3Csvg%20height%3D%22210%22%20width%3D%22500%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Cpath%20d%3D%22M50%2C3l12%2C36h38l-30%2C22l11%2C36l-31-21l-31%2C21l11-36l-30-22h38z%22%20fill%3D%22%23FF0%22%20stroke%3D%22%23FC0%22%20stroke-width%3D%222%22%2F%3E%0A%3C%2Fsvg%3E)

Ou bien comme balise image :

<img src="data:image/svg+xml;ascii,%3Csvg%20height%3D%22210%22%20width%3D%22500%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%3Cpath%20d%3D%22M50%2C3l12%2C36h38l-30%2C22l11%2C36l-31-21l-31%2C21l11-36l-30-22h38z%22%20fill%3D%22%23FF0%22%20stroke%3D%22%23FC0%22%20stroke-width%3D%222%22%2F%3E%0A%3C%2Fsvg%3E"
 style="margin: auto;" alt="etoile">