css3--简单的加载动画

        .load-container {
            width: 30%;
            height: auto;
            position: relative;
            margin: 1rem auto;
        }

        .load {
            width: 2.6rem;
            height: 2.6rem;
            margin: 0 auto;
            border: 0.4rem solid #f3f3f3;
            border-top: 0.4rem solid #33adee;
            border-radius: 50%;
            animation: loading 1.2s infinite linear;
        }

        @-webkit-keyframes loading {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        @-moz-keyframes loading {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        @-ms-keyframes loading {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        @-o-keyframes loading {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        @keyframes loading {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        <div class="load-container">
            <div class="load"></div>
        </div>