用css3简单写头像旋转360度效果

效果:


 

 

 

 

 

 



 CSS3代码:  
            <style type="text/css">
                img{
                    border: #000 solid 2px;
                    display: block;
                    margin: 50px auto;
                    /*圆角*/
                    border-radius: 50%;
                    transition: all 2.0s;
                }
                img:hover{
                   /*旋转*/
                    transform: rotate(360deg);
                }
            </style>
 html代码:
        <body>
            <img src="https://ww2.sinaimg.cn/large/005BYqpggy1fw4j2r0ddoj318g18gjwx.jpg" />
        </body>
    

 

未经允许不得转载:乔越博客 » 用css3简单写头像旋转360度效果

赞 (1) 打赏

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏