悬停上浮的同时阴影扩大变深，Hover.css 经典效果
← 返回 入场与交互动画 类特效列表上方为纯 CSS 实时演示，直接将鼠标移上去 / 点击感受效果
.fx .gsh{width:140px;height:90px;margin:60px auto;border-radius:14px;background:linear-gradient(135deg,#f778ba,#a371f7);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;transition:transform .3s,box-shadow .3s;box-shadow:0 4px 12px rgba(0,0,0,.3);cursor:pointer}
.fx:hover .gsh{transform:translateY(-8px) scale(1.06);box-shadow:0 18px 36px rgba(0,0,0,.55)}<div class="fx">
<div class="gsh">生长阴影</div>
</div>