这是一个简单的css照片环绕效果，照片展示，或者图片宣传都是一个不错的宣传方式，下面我们来看看怎么实现的
【第一步】
在一个div盒子中放入十张图片，也不一定要十张，根据自己需要哈，不过如果数量不对，旋转角度就跟我这里不一样了，因为我没设置变量哈，所以尽量用十张
设置盒子样式
.photo{
height: 500px;
transform-style: preserve-3d;
background-color: #eaefef;
}
先给它一个高度和背景颜色+3d样式
把图片设置在盒子中间
.photo img{
width: 200px;
height: 300px;
position: absolute;
left : calc ( 50 % - 宽度 / 2 );
top : calc ( 50 % - 高度 / 2 );
}
设置图片宽度高度，绝对定位，计算居中
现在为什么没效果呢？因为图片都重叠在圆的中心，就是旋转轴的中点
所以应该把图片位置均匀分布在四周
三角形的斜边设为500px，就是圆的半径500px，怎么求三角形的另外两边的长度呢，这就涉及到简单的三角形函数的知识，正玄和余玄的算法
上面是设置变量，然后计算方法
设置然后应用设置每张图片的位置，最后再添加动画沿着Y轴0deg到360deg，最后还要给盒子添加个父元素，再加个div,background-color: #000;overflow: hidden;perspective: 2000px;position: relative;加个背景颜色，溢出隐藏，景深效果还有相对定位