渐变banner
<div class="bannerTop" style="z-index:-9;">
</div>
#indextype{
display:none !important;
}
.bannerTop{
width:100%;
min-width:1920px;
height:260px;
background: linear-gradient(to right, #c04848, #480048);
position: relative;
animation: colorswitch 20s infinite;
/* Firefox */
-moz-animation: colorswitch 20s infinite;
/* Safari and Chrome */
-webkit-animation: colorswitch 20s infinite;
/* Opera */
-o-animation: colorswitch 20s infinite;
}
@keyframes colorswitch {
0% {
background: #0087C9
}
16% {
background: #EF4A53
}
32% {
background: #FFB463
}
49% {
background: #33D5D4
}
65% {
background: #254356
}
81% {
background: #5B4097
}
100% {
background: #0087C9
}
}
/* Firefox */
@-moz-keyframes colorswitch {
0% {
background: #0087C9
}
16% {
background: #EF4A53
}
32% {
background: #FFB463
}
49% {
background: #33D5D4
}
65% {
background: #254356
}
81% {
background: #5B4097
}
100% {
background: #0087C9
}
}
/* Safari and Chrome */
@-webkit-keyframes colorswitch {
0% {
background: #0087C9
}
16% {
background: #EF4A53
}
32% {
background: #FFB463
}
49% {
background: #33D5D4
}
65% {
background: #254356
}
81% {
background: #5B4097
}
100% {
background: #0087C9
}
}
/* Opera */
@-o-keyframes colorswitch {
0% {
background: #0087C9
}
16% {
background: #EF4A53
}
32% {
background: #FFB463
}
49% {
background: #33D5D4
}
65% {
background: #254356
}
81% {
background: #5B4097
}
100% {
background: #0087C9
}
}