body{/* 透视 */perspective: 800px;
}
div{transform-style:preserve-3d;width:259px;height:396px;margin: 100px auto;position: relative;
}
div img{position: absolute;width:259px;height:396px;left:0;top:0;transition: all linear 2s;z-index: 0;
}
div img:nth-child(1){/* 这张图片背向我们的时候能否看到 */backface-visibility:hidden;z-index: 1;
}
div:active img{transform:rotateY(180deg)
}
图片可以自定义,这里我随便放置,不做要求
<div id="box"><img src="./pkOne.jpg" alt=""><img src="./pkTwo.jpg" alt=""></div>