Dans le cours : HTML : Les images responsive

Accédez au cours complet aujourd’hui

Inscrivez-vous aujourd’hui pour accéder à plus de 24 700 cours dispensés par des experts.

Utiliser les balises <figure> et <figcaption>

Utiliser les balises <figure> et <figcaption> - Tutoriel HTML

Dans le cours : HTML : Les images responsive

Utiliser les balises <figure> et <figcaption>

En HTML 5, vous allez souvent voir une autre façon de placer des images dans une page web. Il s'agit d'utiliser la balise figure. Donc, je vais définir un élément figure ici, entre mon titre de niveau un et mon paragraphe. Voici cette balise figure qui s'ouvre et qui se ferme. Et c'est maintenant au sein de cet élément figure que je vais définir mon image. Voilà, je sauvegarde et je reviens dans mon navigateur et voilà ce que ça donne. Cette image se trouve maintenant entre le titre de niveau un et le premier paragraphe, et puis vous remarquez ce petit retrait par rapport au bord gauche de la page web. Effectivement, si j'utilise mes outils d'inspection, eh bien, je vois tout de suite que cet élément figure vient avec une marge de 40 pixels à gauche et à droite, et de 16 pixels au-dessus et en dessous. Ce sont bien sûr des valeurs par défaut que vous pouvez modifier en CSS. Un autre avantage de la balise figure, c'est une autre balise de l'HTML 5, la balise figcaption. La voilà, elle…

Table des matières