Card

My fancy headline

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somehere
<div class="card card--bg-primary">

  <img src="" alt="" class="" width="100%" height="auto" />

  <div class="card-block">
    <h2 class=card-title>
        My fancy headline
</h2>

    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>

    <a href="link" class="btn btn-secondary">
    Go somehere </a>

  </div>

</div>
			  

My fancy headline

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somehere
<div class="card card--bg-image" style="background-image:url('/images/placeholder-ratio.jpg')">

  <img src="" alt="" class="" width="100%" height="auto" />

  <div class="card-block">
    <h2 class=card-title>
        My fancy headline
</h2>

    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>

    <a href="link" class="btn btn-primary">
    Go somehere </a>

  </div>

</div>
			  

My fancy headline

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
<div class="card class">

  <img src="/images/placeholder-ratio.jpg" alt="" class="card-img-top" width="100%" height="auto" />

  <div class="card-block">
    <h4 class=card-title>
        My fancy headline
</h4>

    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>

    <a href="target" class="btn btn-primary">
    Go somewhere </a>

  </div>

</div>
			  

My fancy headline

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
<div class="card card-inverse">

  <img src="/images/placeholder-ratio.jpg" alt="" class="card-img-top" width="100%" height="auto" />

  <div class="card-img-overlay">
    <h2 class=card-title>
        My fancy headline
</h2>

    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>

    <a href="target" class="btn btn-primary">
    Go somewhere </a>

  </div>

</div>
			  

My fancy headline

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
<div class="card card--img-left">

  <img src="/images/placeholder-square.jpg" alt="" class="card-img-top" width="100%" height="auto" />

  <div class="card-block">
    <h4 class=card-title>
        My fancy headline
</h4>

    <p class="card-text">
      Some quick example text to build on the card title and make up the bulk of the card's content.
    </p>

    <a href="target" class="btn btn-primary">
    Go somewhere </a>

  </div>

</div>