用css实现图片斜侧着沿着z轴旋转效果
一、原始图
一、最终效果图
底部图片例子:
一、html代码
<div class="active-box" v-show="index == activeIndex"><img src="../assets/imgs/home/photosphere.png" class="active-img" /></div>
二、css
.active-box{width: 280px;height: 280px;//沿着x轴旋转65度transform: rotate3d(1, 0, 0, 65deg); //rotate3d(x,y,z,angle)img{width: 100%;height: 100%;animation: zhuan 10s infinite linear;}}@keyframes zhuan {0% {transform: rotateZ(0deg);}100% {transform: rotateZ(360deg);}}