Responsive basic CSS Cards

Live Demo
Responsive basic CSS Cards

Card Title

Lorem ipsum dolor sit amet


<div class="card">
    <img src="https://techoo.info/images/common/600x400/thumbnail-img.svg" alt="animal image">
    <div class="card-content">
        <h2>Card Title</h2>
        <p>Lorem ipsum dolor sit amet </p>
    </div>
</div>


/*  Card css start  */
.card {
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  margin: 20px;
  overflow: hidden;
  width: 300px;
  transition: transform 0.3s ease-in-out;
}
.card:hover {
  transform: scale(1.05);
}
.card img {
  display: block;
  width: 100%;
}
.card-content {
  padding: 20px;
}
/*  Card css end  */


console.log("Hello, World!");





basic CSS card
basic CSS card

Privacy Policy | Cookies Policy | Contact Us

We use cookies to improve your experience. By using our site, you agree to our cookie policy.