直接上代码:
.member-top { -webkit-animation:changeBg 20s infinite; -moz-animation:changeBg 20s infinite; animation:changeBg 20s infinite;background-color:#ED5564; background-image: url(member_top_bg.png); background-size: cover; text-align: center; width: 100%; height: 11rem; position: relative; z-index: 1;} @-webkit-keyframes changeBg{ 0%{background-color:#ED5564;} 10%{background-color:#FB6E52;} 20%{background-color:#FFCE55;} 30%{background-color:#A0D468;} 40%{background-color:#48CFAE;} 50%{background-color:#4FC0E8;} 60%{background-color:#5D9CEC;} 70%{background-color:#AC92ED;} 80%{background-color:#EC87BF;} 90%{background-color:#ED5564;} } @-moz-keyframes changeBg{ 0%{background-color:#ED5564;} 10%{background-color:#FB6E52;} 20%{background-color:#FFCE55;} 30%{background-color:#A0D468;} 40%{background-color:#48CFAE;} 50%{background-color:#4FC0E8;} 60%{background-color:#5D9CEC;} 70%{background-color:#AC92ED;} 80%{background-color:#EC87BF;} 90%{background-color:#ED5564;} } @keyframes changeBg{ 0%{background-color:#ED5564;} 10%{background-color:#FB6E52;} 20%{background-color:#FFCE55;} 30%{background-color:#A0D468;} 40%{background-color:#48CFAE;} 50%{background-color:#4FC0E8;} 60%{background-color:#5D9CEC;} 70%{background-color:#AC92ED;} 80%{background-color:#EC87BF;} 90%{background-color:#ED5564;} }