CSS：loading动画，图片自身旋转

css文件

                                        .icon {
                                            margin: 32px auto 0px;
                                            width: 22px;
                                            height: 22px;
                                            background: url(../../img/loading.png) no- 
                                                        repeat center center;
                                            background-size: 100% 100%;
                                            cursor: pointer;
                                            @keyframes rotation{
                                            from {-webkit-transform: rotate(0deg);}
                                            to {-webkit-transform: rotate(360deg);}
                                            }
                                            transform: rotate(360deg);
                                            animation: rotation 3s linear infinite;
                                            -moz-animation: rotation 3s linear infinite;
                                            -webkit-animation: rotation 3s linear infinite;
                                            -o-animation: rotation 3s linear infinite;
                                        }

html文件

<div class="icon"></div>

注：原理就是让loading图片自身旋转