Figures

XS

Portrait Phones

<576px

SM

Landscape Phones

≥576px to <768px

MD

Tablets

≥768px to <992px

LG

Laptops

≥992px to <1200px

XL

Desktops

≥1200px


                    <figure class="figure">


                    <img src="..." class="figure-img img-fluid rounded" alt="...">


                    <figcaption class="figure-caption">


                    A caption for the above image.


                    </figcaption>


                    </figure>

Anytime you need to display a piece of content—like an image with an optional caption, consider using a <figure>. Use the included .figure, .figure-img and .figure-caption classes to provide some baseline styles for the HTML5 <figure> and <figcaption> elements. Images in figures have no explicit size, so be sure to add the .img-fluid class to your <img> to make it responsive.