Skip to content

Galeries ​

gallery utilise trois colonnes par défaut ; ajoutez cols-2 à cols-6 pour en choisir le nombre. Chaque image doit être seule dans un paragraphe, avec une ligne vide entre les images.

md
<!-- _class: content gallery cols-3 bg with-title with-legend -->

# Trois points de vue

![](vue-a.png)

![](vue-b.png)

![](vue-c.png)

Images illustratives.

Avec cards, les cadres des images sont habillés :

md
<!-- _class: content gallery cols-4 bg cards with-title color-4 -->

# Quatre ambiances

![](image-1.png)

![](image-2.png)

![](image-3.png)

![](image-4.png)

Ce qu’il faut savoir :

  • Les cadres mesurent 200 pixels de haut dans cette version ; small change le texte, pas cette hauteur.
  • La galerie ne pagine pas automatiquement et ne s’adapte pas à un nombre croissant d’images : au-delà de ce qui tient, créez une autre slide.
  • with-legend donne une légende pour toute la slide, pas une par image.

gallery-bento attend exactement six images, dans six paragraphes successifs. Elle possède quatre colonnes de largeurs différentes et deux rangées.

ImageEmplacement
1Première colonne, sur les deux rangées
2Première rangée, colonnes 2 et 3
3Première rangée, colonne 4
4Deuxième rangée, colonne 2
5Deuxième rangée, colonne 3
6Deuxième rangée, colonne 4
md
<!-- _class: content gallery-bento bg with-title -->

# Mosaïque

![](image-1.png)

![](image-2.png)

![](image-3.png)

![](image-4.png)

![](image-5.png)

![](image-6.png)

Pas de paragraphe intercalé

La position de chaque image dépend de son rang parmi les paragraphes. N’ajoutez pas de texte d’introduction entre le titre et les images. Une légende finale reste possible avec with-legend. cols-N ne s’applique pas au bento.

Documentation du langage DWA Core v1, de l’extension VS Code, du CLI et du portail des thèmes.