Question

好的，所以我的网站存在问题我正在创建。我有3个主要的div：标题，顶部栏，位于de header下方，主div ，位于de top bar下方。

在我的主要部分中，我放了一辆汽车的图像并用java脚本移动到顶部。但是，在页面顶部的方式中，我将标题和我的顶栏 div，并且图像向上移动，正在移动到前面的div，所以div就是形象的背后。我已经尝试了几乎所有关于位置和index-z的东西，但是我无法弄明白，如何将图像放在div上面时它会上升。我希望你理解并请帮助我。

http://i.imgur.com/wf9RJRO.png 这是汽车网页的一部分。我只是希望它在这些div上升的时候落后于它们。

这是汽车的形象：

<img src="images/top_main_image.png" id="car" style="position:relative;bottom:5px;margin-left:41.8%;margin-top:50px;">

这是标题div和顶栏：

div.header
{
    width:auto;
    height:45px;
    background-color:#333333;
    float:center;
    background-repeat: no-repeat;
    background-position: auto; 
    position:absolute;
    opacity:1;
    width:100%;
    z-index:10;
}

div.top_bar
{
    width:auto;
    height:110px;
    background-color:#f7f7f7;
    float:center;
    background-repeat: no-repeat;
    background-position: auto; 
    posotion:absolute;
    z-index:10;
}

Answer 1

您应该将此CSS用于图像。我将位置从相对位置改为绝对位置，并添加了z-index。您可以尝试整个示例here。

  position: absolute;
  bottom: 5px;
  margin-left: 41.8%;
  margin-top: 50px;
  z-index: -1

图像在div后面移动

1 个答案: