Cards
Cards are flexible content containers.
Microsoft
Software and hardware
Empower every person and every organization on the planet to achieve more.
Apple
Hardware and software
To make a contribution to the world by making tools for the mind that advance humankind.
Google I/O
Software and hardware
An immersive, three-day experience focused on exploring the next generation of technology, mobile and beyond.
Surface Studio. Turn your desk into a Studio. Surface Studio is designed for the creative process.
Apple
Hardware and software
To make a contribution to the world by making tools for the mind that advance humankind.
Google
Software and hardware
Organize the world’s information and make it universally accessible and useful.
Add a container element with the card class.
And add child elements with the card-image, card-header, card-body and/or card-footer classes.
The card-image can be placed in any position.
<div class="card">
<div class="card-image">
<img src="img/osx-el-capitan.jpg" class="img-responsive">
</div>
<div class="card-header">
<div class="card-title h5">...</div>
<div class="card-subtitle text-gray">...</div>
</div>
<div class="card-body">
...
</div>
<div class="card-footer">
<button class="btn btn-primary">...</button>
</div>
</div>
Microsoft
Software and hardware
Empower every person and every organization on the planet to achieve more.
Add card-shadow class to a card element to get a card with shadow.
<div class="card card-shadow">
...
</div>