css如下,主要利用line-gradient和animation,demo
@keyframes test
{
from { left: 0 }
to { left: -100% }
}
.container {
position: relative;
width: 100%;
height: 5px;
/* border: 1px solid gray; */
border-radius: 10px;
overflow: hidden;
}
.container:after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 200%;
height: 100%;
background: linear-gradient(115deg, #fff,#ffea97,#ffc5da,#62d3ff, #fff);
background-size: 50% 100%;
display: block;
animation: test .75s linear infinite;
}