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">

      <div class="card-block">
        <p class="card-text">
          Lorem ipsum dolor sit amet...