clip:rect矩形剪裁功能

clip:rect(0,400px,2px,0)

四个参数分别为上右下左距离左边的距离

.line:hover::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border: 2px solid skyblue;
    animation: lineOne 8s linear infinite;
    animation-delay:-4s;
    z-index: 99;
 }

 @keyframes lineOne {
 0%,100%{clip:rect(0,400px,2px,0)}
     25%{clip:rect(0,3px,329px,0)}
     50%{clip:rect(326px,400px,329px,2px)}
     75%{clip:rect(0,400px,328px,396px)}
}