cards

W3.CSS Cards

Cards are a flexible and extensible content container. Use the w3-card class to create cards in W3.CSS.

Basic Card

<div class="w3-card w3-padding w3-margin">
  <h3>Card Title</h3>
  <p>This is a basic card.</p>
</div>

Card with Image

Combine images with cards to make them more visually appealing:

<div class="w3-card w3-margin">
  <img src="https://via.placeholder.com/400x200" class="w3-image">
  <div class="w3-container">
    <h3>Card Title</h3>
    <p>Card content goes here.</p>
  </div>
</div>