The card component

Cards are a new component in Bootstrap 4 that replaces wells, panels, and thumbnails. 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.

Here is an example that demonstrates how to create a card and all of its subparts and styles. Place this code at the end of the container element of index.html:

<div class="row"> <div class="col-md-4"> <div class="card"> <div class="card-header"> Featured </div> <div class="card-block"> <h4 class="card-title">Card title</h4> <h6 class="card-subtitle">Support card subtitle</h6> </div> <img class="img-fluid" src="https://placehold.it/800x400" alt="Card image cap"> ...

Get JavaScript: Moving to ES2015 now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.