Twitter Bootstrap 4 – Cards

Your future, its in the Cards..

I have been brushing myself back up on web technologies again, and as many do, love the Bootstrap library.  I wanted to cover the new Cards in Twitter Bootstrap alpha version 4.  This is a simplification of 3 of their previous components, Panels, Thumbnails, and Wells.  Of those three I’m least familiar with wells.

Create a Thumbnail using a Card

ThumbnailBootstrap

Thumbnail now:

 

Using Card:

 

Create a Panel using a Card

 PanelBootstrap

Panel now:

Using Card:

 

Create a Wells using a Card

 WellBootstrap

Well now:

 

Using Card:

 

The styles are fairly close, but as you can see there is not a straight transition, but it gives you a little more flexibility as well.  I hope to cover more of the interesting features of cards in future posts.

 

Leave a Reply

Your email address will not be published. Required fields are marked *