Source

Figury

Dokumentacja i przykłady wyświetlania powiązanych obrazów i tekstu z komponentem figury w Bootstrap.

Za każdym razem, gdy chcesz wyświetlić jakąś treść, np. obraz z opcjonalnym podpisem, rozważ użycie <figure>.

Użyj klas include i .figure, aby zapewnić style bazowe dla HTML5 i elementów. Obrazy na rysunkach nie mają określonego rozmiaru, więc pamiętaj, aby dodać klasę do swojej , aby była responsywna..figure-img.figure-caption<figure><figcaption>.img-fluid<img>

400x300
Podpis do powyższego obrazu.
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

Dzięki naszym narzędziom tekstowym wyrównanie podpisu rysunku jest łatwe .

400x300
Podpis do powyższego obrazu.
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
  <figcaption class="figure-caption text-right">A caption for the above image.</figcaption>
</figure>