<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>旋转效果</title> <style> img { width: 250px; transition: all 2s; } img:hover { /* 顺 */ transform: rotateZ(360deg); /* 逆 */ /* transform: rotate(-360deg); */ } </style> </head> <body> <img src="./images/rotate.png" alt=""> </body> </html>
