css3实现背景切换动画

.main{
    -webkit-animation:background 10s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-direction:alternate;
    -webkit-animation-timing-function: ease-in-out;
    height: 100vh;
    width: 100%;
}
@-webkit-keyframes background
{
    from { background:url(img/one.jpg) no-repeat center;
    background-size: cover}
    to { background:url(img/two.jpg) no-repeat center ;
    background-size: cover}
}
/*加灰幕*/
.main-back{
    display: block;
    height: 100vh;
    width: 100%;
    background-color: rgba(85, 85, 85, 0.5);
}