Responsive Ad Slot

CSS box-shadow Responsive Profile Card - Pure CSS Box

Wednesday, February 16, 2022

/ by Admin

CSS Section:

 <style>
.card {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  width: 100%;
}
.card:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
</style>

HTML Section:

<div class="card">
  <img src="https://blogger.googleusercontent.com/img/a/AVvXsEhBWplK6xenUfr2YC9NmhSTZyd01xUjlidCd8Y2hrCRnHgq-3H26JN8dUq-lLG63QV7A4RYXeOMKY-V0GzY_qjN3Lw9Z5WhO7469W7S1nKESZ4hq29Qo72qYLMKQsr-TbnDTupPQRGTLM1jzut39qPsgAYglYmg8ezMmHnoi8AHNemHUKn587eke8q9=s400" alt="Avatar" style="width:100%;" />
  <div style="background:linear-gradient(to right, #00ccff 0%, #99ff99 100%);color: #fff;text-align: center;padding: 5px;font-weight: 600;"><a href="#">Sign up !</a></div> 
</div>







No comments

Post a Comment

Leave with comments

Don't Miss
© all rights reserved
made with by templateszoo