效果图1：CSS原效果（可旋转）   效果图2：需要的效果 

CSS代码：

    .loader {
      position: absolute;
      top: 98rpx;
      left: calc(50% - 142rpx);
      --s: 4rpx;
      width: 284rpx;
      height: 284rpx;
      /* border: 1px solid red; */
      border-radius: 50%;
      display: grid;
      -webkit-mask: radial-gradient(
        50% 50%,
        #0000 calc(99% - 2 * var(--s)),
        #000 calc(100% - 2 * var(--s))
      );
      animation: animate 3s linear infinite;
    }

    .loader::before {
      content: "";
      background: conic-gradient(
        from 25deg,
        #fc5858 25%,
        transparent 0 50%,
        #fc5858 0 75%,
        transparent 0
      );
      -webkit-mask: repeating-conic-gradient(#0000 0 25deg, #000 23% 25%),
        radial-gradient(var(--s) at var(--s) 50%, #000 97%, #0000)
          left/calc(100% - 2 * var(--s)) 100% repeat-x;
    }
    @keyframes animate {
      0% {
        transform: rotate(0deg);
      }

      100% {
        transform: rotate(360deg);
      }
    }