この記事では主にアバターの回転効果を実現するための CSS3 を紹介します。編集者はそれを参考として共有します。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。
マウスが置かれていないときの効果:
マウスが置かれた後の回転効果:
transition: すべての属性変換が 2 秒以内に完了することを意味します。 :rotate(360deg) ; 画像が 360 度回転されることを示します。
nbsp;html> <meta> <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> <img alt="アバター回転エフェクトのCSS3実装例共有" >
関連する推奨事項;
以上がアバター回転エフェクトのCSS3実装例共有の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。