用CSS3设计照片墙

这个墙可以环绕起来 并转动
首先清楚一下思路
第一步：可以将这八张照片叠起来
第二步：用CSS3设置3d空间
第三步：分别将这八张图片在3d空间里沿着父级的Y轴分别旋转45，90,135度…（因为360度里分八份）。
第四步：做到这一步会发现，这八张图虽然已经转开，但是还没有彼此产生间距，这个时候用transform属性的translateZ属性将每个图里父级的距离移开，就会形成这个照片墙。
第五步：给父级设置关键帧动画，就可以将整个照片墙旋转起来。
就下来进行代码展示：

 <div>
        <ul>
            <li>
                <img src="./img/2.jpg" alt="">
            </li>
            <li><img src="./img/1.jpg" alt=""></li>
            <li><img src="./img/7.jpg" alt=""></li>
            <li><img src="./img/8.jpg" alt=""></li>
            <li><img src="./img/4.jpg" alt=""></li>
            <li><img src="./img/5.jpg" alt=""></li>
            <li><img src="./img/6.jpg" alt="">