Html 引导彼此上的两个div（一个用作背景图像）

您能否帮助我使用bootstrap（或任何其他响应css框架）完成类似的工作：

我想有一个容器，然后在一行中，两个div相互重叠，一个div是背景图像（100%宽度），另一个是顶部div和另一个图像实际上，我还想对两个div应用动画，背景图像需要在顶部div之后显示一点

到目前为止，我能够做到如下几点：

<div class="container-fluid">
<div class="row background-image">
<div class="col-md-6 col-md-offset-3 animation-1">
<img src="1.svg" style="width: 100%; height: auto;">
</div>
</div>
</div>

.background-image {background: black url("backgroundimage.svg") no-repeat;
                   background-position: center;
                   background-size:100% }

---

所以，这将非常好地工作，但我“不能”添加动画到我的css类。背景图像？因此，它将在顶部div显示后显示

您可以使用jquery和

setTimeout来做一些非常简单的事情：

setTimeout(function(){ //show image 1
  $(".background-img").animate({"opacity":"1"}); 
}, 1000);

setTimeout(function(){ //show image 2
  $(".background-top").animate({"opacity":"1"}); 
}, 1500);

我不明白，你的图像显示了一行3个盒子，但你说你想要
一个容器，然后在一行中，每个容器顶部各有2个div
…你能用不同的方式解释吗？图像确实不是很清楚，但是顶部div是一个div，背景图像div是第二个div（这是整行的宽度），没有第三个div:）。也许这张图片可以更好地说明，最上面的div在中间。Top div由引导偏移量3ok居中，所以您唯一的问题是要添加的动画？是的，使用这种方法，我认为这是唯一的问题。我不知道如何将动画（css淡入效果）添加到背景图像div。否则，如果我不使用此方法，我不知道如何使用背景图像div作为顶部div下的背景，背景图像需要空alt文本（即alt=”“）。看见