Cet article présente principalement l'effet de rotation des avatars en utilisant CSS3. L'éditeur pense que c'est plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence. Suivons l'éditeur pour y jeter un oeil
L'effet de la souris n'est pas placé :
Effet de rotation après avoir placé la souris :
transition : tous 2.0 signifie tous attributs La transformation est terminée en 2 secondes ;
transform : rotate(360deg); signifie que l'image est pivotée de 360 degrés.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
img{
border: #000 solid 2px;
display: block;
margin: 50px auto;
border-radius: 50%;
transition: all 2.0s;
}
img:hover{
transform: rotate(360deg);
}
</style>
</head>
<body>
<img src="img/03.jpg" / alt="Exemple de code pour implémenter l'effet de rotation d'avatar à l'aide de CSS3" >
</body>
</html>Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
tutoriel CSS3
Quelles sont les propriétés du dégradé CSS3 ?
Pourquoi Webstorm ne peut pas exécuter le fichier
Comment démarrer le service SVN
comment cacher l'adresse IP
Tutoriel du portefeuille Eou web3
Quelle est la différence entre Douyin et Douyin Express Edition ?
Comment utiliser la sous-intrigue dans Matlab
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
