Cards

A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options. If you’re familiar with Bootstrap 3, cards replace our old panels, wells, and thumbnails. Similar functionality to those components is available as modifier classes for cards. card content can be aligned to center or right by using helper classes such as text-center or text-right.

 Copy<div class="card">
    <div class="card-body">
        <h5 class="card-title">Card Title</h5>
        <p class="card-text">Left-aligned content. Example text to build on the card title and make up the bulk of the content.</p>
        <a href="#x" class="btn btn-primary">Button</a>
    </div><!-- / card-body -->
</div><!-- / card -->