通过css样式简单几行实现圆形头像并且旋转,兼容性不太好,上代码,然后慢慢解释。

<style>
    img{
        width: 100px; //头像宽度
        height: 100px; //头像宽度
        border: #fff solid 0px; //头像边框,这里为0
        display: block; //元素块化
        margin: 20% auto; //水平垂直居中对齐
        border-radius: 50%; //实现圆形头像,通过边框实现
        transition: all 2.0s; //2秒内完成下列操作
    }
    img:hover{
        transform: rotate(360deg); //旋转度数
    }
</style>
最后修改:2021 年 04 月 10 日

❤感谢耐心看完,觉得文章不错的话,可以点个赞~或者请作者喝杯咖啡~ヾ(◍°∇°◍)ノ゙❤