.lineBarDis { height: 8px; background-image: linear-gradient(to right, #011c72 0%, #c7ced2 100%); animation: myAnimation 1.5s infinite; /* 设置动画为2秒钟的时间,并无限循环 */ } @keyframes myAnimation { 0% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 0%); } 10% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 10%); } 20% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 20%); } 30% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 30%); } 40% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 40%); } 50% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 50%); } 60% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 60%); } 70% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 70%); } 80% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 80%); } 90% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 90%); } 100% { background-image: linear-gradient(to right, #011c72 0%, #c7ced2 100%); } }
标签:动画,right,demo,image,011c72,c7ced2,background,0%,CSS From: https://www.cnblogs.com/sexintercourse/p/17672284.html