这是一款基于纯 CSS 三维变换与关键帧动画技术实现的六面图片自动旋转的环形轮播。六张产品图片分布在一个立体圆环上，随着容器连续自转，正面、侧面与后排卡片依次经过视线。每张卡片都有圆角和内外阴影，整体偏向带浮雕质感的产品展示。页面没有 JavaScript，图片保存在本地；鼠标进入外层时会改变透视原点，让观察角度产生变化。
六面图片圆环持续旋转时有哪些层次
六面按固定角度排开。相邻卡片相差六十度，并沿纵深方向推出，构成完整环形布局。
整组共用自转动画。旋转作用于父容器，卡片不需要各自维护播放进度，循环节奏保持一致。
卡片阴影随图片一起转动。圆角、内阴影与落影附着在面板上，增强产品图块的立体感。
CSS环形轮播的等分角度与透视结构
圆环由保留三维空间的父层承载，各卡片先绕纵轴转到自己的角度，再通过 translateZ 推向圆周。父层旋转一整圈形成循环，透视则由外层提供。悬停改变的是观察视点，不会停止动画，也不会把某张卡片锁在正前方。
animation: spin 15s infinite linear;
环形产品图墙如何更换图片和旋转周期
六张图片与替代文字在 index.html，img 保存本地产品图；旋转周期、卡面尺寸、圆角和阴影在 style.css。增加卡片时，需要重新计算等分角度，并结合卡片宽度调整圆环半径。小屏用了整体缩放，若准备作为主要商品入口，还需要补充可点击链接和明确操作方式。
纯CSS旋转图环的控制方式与数量限制
可以点击左右按钮切换吗？
当前没有按钮、拖拽或选中状态，展示方式是自动旋转。需要手动选择时，应另行增加轮播控制逻辑。
为什么改图片数量后位置不均匀？
现有六个位置是固定角度，增删图片不会自动重新排布。需要同时修改角度和半径，而不是只改 HTML 数量。
可以暂停旋转吗？
现有悬停只改变透视原点，没有暂停规则。可以在样式中增加动画暂停状态，或设置更慢的周期，具体交互应按页面需要设计。
适合产品概览、图片装饰墙与三维轮播样式演示。完整圆环排布和透视样式可下载查看。
