光泽扫过效果 | wjs-css-effects

关键点

光泽扫过效果使用伪元素 ::before 创建一个斜向的渐变高光条
通过 transform: translateX() 或改变 background-position 让高光从左滑到右
按钮设置 overflow: hidden，确保光泽条在按钮边界外不可见
高光使用 linear-gradient 从透明到白色半透明再到透明，模拟真实光泽过渡
配合 :hover 伪类触发动画，鼠标移入时光泽扫过一次，提升按钮质感

效果说明

按钮悬停时一道高光斜向扫过。用 ::before 伪元素做一条斜向渐变光带，skewX 倾斜成平行四边形光束，hover 时通过 left 位移动画从左掠到右。纯 CSS 实现，无需 JS，常用于强调型按钮和 CTA。