两个边框的效果

<style>

  .loader-2 {

    border: 16px solid #f3f3f3;

    border-radius: 50%;

    border-top: 16px solid #3498db;

    border-bottom: 16px solid #3498db;

    width: 120px;

    height: 120px;

    -webkit-animation: spin 2s linear infinite;

    animation: spin 2s linear infinite;

  }

​

  @-webkit-keyframes spin {

    0% {

      -webkit-transform: rotate(0deg);

    }

    100% {

      -webkit-transform: rotate(360deg);

    }

  }

​

  @keyframes spin {

    0% {

      transform: rotate(0deg);

    }

    100% {

      transform: rotate(360deg);

    }

  }

</style>

​

<div class="loader-2"></div>