如图所示，这是一个很炫酷的卡片效果，关键效果在于卡片的边框呈渐变色变化着，在网页中有这样一个卡片相信可以极大的增强用户体验交互。本次文章将解读如何使用纯CSS实现这个炫酷的卡片效果。 基于上面的动图可以分析出以下是本次实现的主要几点： 卡片的边框是渐变色 卡片的边框呈顺时针动画 卡片底部还有阴影随着边框动画而变化 鼠标悬停时动画隐藏显示静态的卡片 实现过程 看到这样的边框首先要想到的是CSS本身是不支持这种效果的，所以需要从其他的地方入手，其实实现的方式很简单，卡片黑色内容区域是一个独立的盒子，看到的渐变边框区域是另一个盒子，只不过内容区域的层级更高且四周都空出了边框的距离，所以肉眼看到...