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 (left,top) 位置。

于 2012-07-27T14:19:51.703 回答