css3点击图片旋转180

你可以使用CSS3的transform属性来实现点击图片旋转180度的效果。具体的做法是，在图片的CSS样式中设置一个初始的旋转角度为0度，然后在点击事件中通过添加一个新的样式类来改变旋转角度为180度。

HTML代码：

<img src="your-image-path" class="rotate">

CSS代码：

.rotate {
  transition: transform 0.5s ease;
  transform: rotate(0deg);
}

.rotate180 {
  transform: rotate(180deg);
}

JavaScript代码：

const img = document.querySelector(".rotate");
img.addEventListener("click", () => {
  img.classList.toggle("rotate180");
});

这样当你点击图片时，它会旋转180度，再次点击则会回到初始状态。