纯css3实现走马灯效果

纯css3实现了一个正六边形的走马灯效果，记录一下css3动画的学习情况，效果如下： 主要用到的css3技术有：keyframes、perspective、perspective-origin、transform（translate、rotate）、animation、transform-origin，另外加一点平面几何知识（计算间距、角度啥的），详细过程如下： 首先设计一下要显示的布局（俯视图），途中垂直的线为辅助线，计算偏移量时需要用的： 红色框框为旋转面（即走马灯效果的结构最终以该面的中点为旋转轴旋转的），六个面也都是基于这个面做的布局，先看红框下面的三个面，左侧的面原本在蓝色线处，