类型:特效 · 分类:Hover.css 悬停效果 · 收录:2026-09-19 · 源码:会员可见
[hidecontent type="vip1"]源码
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style>html,body{margin:0;height:100%;display:flex;align-items:center;justify-content:center;background:#0d0d0f;overflow:hidden}body>*{max-width:100%}@media(prefers-color-scheme:light){html,body{background:#f6f7f8}}</style></head><body><!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="stylesheet" href="https://skillx.work/wp-content/uploads/yunjing/media/lib/hover.min.css"><style>html,body{margin:0;height:100%;display:flex;align-items:center;justify-content:center;background:#0d0d0f;overflow:hidden;font-family:system-ui,-apple-system,"PingFang SC",sans-serif}.demo{width:96px;height:96px;border-radius:20px;background:linear-gradient(135deg,#e5a34a,#c88038);display:flex;align-items:center;justify-content:center;color:#1a1206;font-weight:700;font-size:26px;box-shadow:0 12px 34px rgba(229,163,74,.28)}@media(prefers-color-scheme:light){html,body{background:#f6f7f8}}</style></head><body><div class="demo hvr-outline-in">Aa</div><style>.hvr-pv{transform:scale(1.08)}</style><script>(function(){var el=document.querySelector('.hvr-outline-in');if(!el)return;setInterval(function(){el.classList.add('hvr-pv');el.style.filter='brightness(1.08)';setTimeout(function(){el.classList.remove('hvr-pv');el.style.filter=''},900)},1600)})();</script></body></html></body></html>[/hidecontent]