Bootstrap figures

If you need to display an image or a piece of content with a caption, the <figure> element can be used. The <figure> element is part of the HTML5 spec and is not specific to Bootstrap 4. Bootstrap 4 does, however, provide some helper classes to style the <figure> element appropriately.

For example, the following HTML markup will create a <figure> element containing an image and a caption:

<div class="row"> 
    <div class="col-md-12"> 
        <figure class="figure"> 
            <img src="@Url.Content("~/img/bulb.png")" class="figure-img 
             img-fluid img-rounded" alt="Light bulb"> 
            <figcaption class="figure-caption"> 
                This is a public domain image, available from 
            <code>http://publicdomainarchive.com</code> 
            </figcaption> 
        </figure> 
    </div> 
</div> 
...