<div class="radikalwp-hv-sink"><div class="radikalwp-hv-sink-img" style="background:linear-gradient(135deg,#7c3aed,#4338ca)"><//div><b>ده ترفند CSS که باید بلد باشید<//b><//div>

.radikalwp-hv-sink { position: relative; width: 240px; height: 150px; border-radius: 16px; overflow: hidden; cursor: pointer; }
.radikalwp-hv-sink-img { width: 100%; height: 100%; transition: transform .5s ease; }
.radikalwp-hv-sink b {
  position: absolute;
  inset: auto 0 0 0;
  padding: 34px 16px 14px;
  font-size: 13.5px;
  color: #fff;
  background: linear-gradient(transparent, rgba(2, 6, 23, .82));
  transition: transform .5s ease, font-size .3s ease;
}
.radikalwp-hv-sink:hover .radikalwp-hv-sink-img { transform: scale(1.1); }
.radikalwp-hv-sink:hover b { transform: translateY(-6px) scale(.92); }