*{padding:0; margin:0; border:0;}
.left{width:50%; float:left;
animation:myfirst 5s;
-moz-animation:myfirst 5s; /* Firefox */
-webkit-animation:myfirst 5s; /* Safari and Chrome */
-o-animation:myfirst 5s; /* Opera */
}
.right{width:50%; float:left;
animation:myfirst 5s;
-moz-animation:myfirst 5s; /* Firefox */
-webkit-animation:myfirst 5s; /* Safari and Chrome */
-o-animation:myfirst 5s; /* Opera */
animation-delay: 5s; /* W3C 和 Opera */
-moz-animation-delay: 5s; /* Firefox */
-webkit-animation-delay: 5s; /* Safari 和 Chrome */
}
@keyframes myfirst
{
0% { opacity:0;}
100% { opacity:1;}
}
@-moz-keyframes myfirst /* Firefox */
{
0% { opacity:0;}
100% { opacity:1;}
}
@-webkit-keyframes myfirst /* Safari 和 Chrome */
{
0% { opacity:0;}
100% { opacity:1;}
}
@-o-keyframes myfirst /* Opera */
{
0% { opacity:0;}
100% { opacity:1;}
}
![xxx.jpg](images/xxx.jpg)