CSS添加图形旋转动画

添加旋转图形动画

.boll {
    width: 48px;
    height:48px;
    position: absolute;
    top: 4.5%;
    left: 35%;
    transform: translate(-50%, -50%);
    background: url(img/BNM.png) no-repeat;
    background-size: 100% 100%;
    opacity: 0.3;
    animation: rotate1 15s linear infinite;
}
@keyframes rotate1 {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

一般做项目的话，会有学校或者公司的图标（圆形），做一个友好的旋转效果。
我的做法是 先用 PS 或者 美图秀秀，将图形裁剪成圆形。
然后复制到项目中，css代码可以参照上面的代码。