0

こんにちはみんな私は小さなcss3アニメーションを作ろうとしています...問題は、私がやりたいことの上を超えていないことです...それは下に行きます... z-indexを適用しようとしましたが、まだ機能していません...おそらくアニメーションの処理が異なると考えていましたか?

上に移動する方法を知っている人がいたら教えてください

#header{
   background: url(/images/clouds.png) repeat-x center 48px;
   -webkit-animation-name:cloud-crawl-header;
   -webkit-animation-duration:  180s;
   -webkit-animation-timing-function:linear;
   -webkit-animation-iteration-count:infinite;
   -moz-animation-name:cloud-crawl-header;
   -moz-animation-duration:180s;
   -moz-animation-timing-function:linear;
   -moz-animation-iteration-count:infinite;
   z-index: 5;
}
@-webkit-keyframes cloud-crawl-header{
    from{ background-position: -100% 48px, center top}to{background-position: 100% 48px, center top}
    }

使用している基本的な画像の上に置きたいだけです...

そのように追加されています

<div class="logo">
   <a href="website.com/bla">
      <img src="images/logo.jpg" alt="logotop" title="title!" />
   </a>
</div>

.logo {
   margin: auto auto;
   text-align: center;
   z-index: -1;
}
4

1 に答える 1

1

要素の位置は現在静的です。z-index を適用するには、相対、絶対、または固定に変更する必要があります。あなたの場合、相対位置を適用するのが最善だと思います。理由: 要素の x、y (左、上) の位置は変更されません。

于 2012-07-27T14:19:51.703 に答える