Markdown et Style

Jake G May 15, 2022 #Features #Markdown

Cet article propose un exemple de syntaxe Markdown de base pouvant être utilisée dans les fichiers de contenu Zola. Il indique également si les éléments HTML de base sont décorés avec CSS dans un thème Zola.

Rubriques

Les éléments HTML <h1><h6> suivants représentent six niveaux d'en-têtes de section. <h1> est le niveau de section le plus élevé alors qu'il <h6> est le plus bas.

H1

H2

H3

H4

H5
H6

Paragraphe

Xerum, quo qui aut unt expliquéam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur ? Quianimin porecus evelectrur, cum que nis nust voloribus ratem aut omnimi, sitatur ? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.

Itatur ? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia est sinveli squiatum, core et que aut hariosam ex eat.

Citations en bloc

L'élément blockquote représente le contenu qui est cité à partir d'une autre source, éventuellement avec une citation qui doit être dans un élément footer ou cite et éventuellement avec des modifications en ligne telles que des annotations et des abréviations.

Blockquote sans attribution

Tiam, ad mint andaepu dandae nostion secatur sequo quae. Notez que vous pouvez utiliser la syntaxe Markdown dans un blockquote.

Blockquote avec attribution

Ne communiquez pas en partageant la mémoire, partagez la mémoire en communiquant.
Rob Pike1

Tous les hommes, par nature, désirent savoir.
Aristotle2

Le pouvoir vient en réponse à un besoin, pas à un désir.
Goku

Les Tables

Les tables ne font pas partie de la spécification principale de Markdown, mais Zola les prend en charge prêtes à l'emploi.

Nom | Âge

--------|------ Alice | 23 Bob | 27 Cody | 33 John | 59 Kerry | 23

Tableau avec Markdown en ligne

ItaliqueGrasCodeBarré
italiquegrascodebarré

Grand tableau dans l'étiquette de la figure

Entourez les très grandes tables <figure></figure> pour qu'elles puissent défiler horizontalement.

FabricantVolkswagenToyotaFordHondaChevroletBMWHyundaiAudiNissanKiaMercedesTeslaMitsubishiSuzukiVolvoSubaruMazdaJaguarBuickLexusGMCPorscheCadillac
Revenu $B$254$249$127$124$123$113$88$83$74$61$55$54$38$31$30$28$27$22$21$19$17$16$12
*valeurs de revenus trouvées sur le moteur de recherche et non vérifiées, uniquement à des fins de démonstration du tableau de défilement des figures.*

Texte pliable

Titre 1

C'EST UN SECRET POUR TOUT LE MONDE.

Titre 2

Reste un moment et écoute!

Blocs de codes

Blocs de code.. ❤️ avec coloration syntaxique automatique ✨‍

Voir les docs pour les options.

Bloc de code avec backticks

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Example HTML5 Document</title>
</head>
<body>
  <p>Test</p>
</body>
</html>

Numéros de ligne, faits saillants

1<!doctype html>
2<html lang="en">
3<head>
4 <meta charset="utf-8">
5 <title>Example HTML5 Document</title>
6</head>
7<body>
8 <p>Test</p>
9</body>
10</html>

Bloc de code en ligne

Si nous voulons, nous pouvons aussi spécifier le code en ligne ce qui est utile pour les petites choses.

Types de liste

Liste ordonnée

  1. Premier élément
  2. Deuxième élément
  3. Troisième élément

Liste non ordonnée

Liste imbriquée

Autres éléments — abbr, sub, sup, kbd, mark, link

GIF est un format d'image bitmap.

H2O

Xn + Yn = Zn

Appuyez sur pour terminer la session. CTRL+ALT+Delete

La plupart salamanders sont nocturnes et chassent les insectes, les vers et autres petites créatures.


1

La citation ci-dessus est extraite du discours de Rob Pike lors du Gopherfest, le 18 novembre 2015.

2

La citation est la première phrase de la Métaphysique d'Aristotle.

Le menu principal du site est créé en imbriquant la navigation sous une balise d'en-tête. Reportez-vous au haut de ce site pour un exemple. La navigation est réactive, réduisez la largeur de la page pour la voir en action.

Formes


Taille