文字和背景渐变动效

1.文字渐变动效         

         h1{color: #f35626;

  background-image: -webkit-linear-gradient(92deg,#f35626,#feab3a);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  -webkit-animation: hue 60s infinite linear;

  }

@-webkit-keyframes hue {

        from {-webkit-filter: hue-rotate(0deg)}

        to {-webkit-filter: hue-rotate(-360deg)}

          }

2.背景渐变动效 

         h1{color: #fff;

  background-image: -webkit-linear-gradient(92deg,#f35626,#feab3a);   

  -webkit-animation: hue 60s infinite linear;

  }

@-webkit-keyframes hue {

         from {-webkit-filter: hue-rotate(0deg)}

         to {-webkit-filter: hue-rotate(-360deg)}

        }

转载于:https://www.cnblogs.com/NatChen/p/8867264.html