CSS实现条纹背景和让背景动起来

html:

css:

.box{
  width:150px;
  height:150px;
  background-image: linear-gradient(
    135deg,
    #e3931a 25%,
    #edb02f 0%,
    #edb02f 50%,
    #e3931a 0,
    #e3931a 75%,
    #edb02f 0%
  );
  background-size: 25px 25px;

  animation: progressMove 4s linear infinite;
}

@keyframes progressMove {
    0% {
        background-position: 0px;
    }
    100% {
        background-position: 100px;
    }
}

效果:





你可能感兴趣的:(CSS实现条纹背景和让背景动起来)