みなさん、私はこのCSSスタイルを持っています:
body {
width:100%;
height:100%;
background:#fff;
background-image: url(bg.png), url(clouds.png);
background-repeat: repeat;
font-family: tahoma;
font-size: 14px;
margin:0;
}
@-webkit-keyframes float {
0% {
background-position: 0 0;
}
100% {
background-position: 1200px 0;
}
}
@media only screen and (min-device-width: 1024px) {
body {
-webkit-animation-name: float;
-webkit-animation-duration: 60s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-moz-animation-name: float;
-moz-animation-duration: 60s;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;
}
}
このコードは bg.png画像をアニメーション化します。しかし、 clouds.png画像をアニメーション化したいです。bg.pngではなく、clouds.pngをアニメーション化するにはどうすればよいですか? :)