html - Bootstrap 3 :/two images responsive together

Question

与 Bosstrap3/。我有2张图片。一张图很大。另一个很小。

两个图像都是响应式的。

我想把小图放在大图上。

静态页面很容易。但我想为响应式页面做这件事。

我希望图像的位置不会随着页面大小的调整而改变。

我试试这个:

<div class="container">

<div class=" panel panel-default">
    <div class="panel-body" style="padding:1px">
        <img class="img-responsive" src="http://placehold.it/1170x300" alt="Chania">
    </div>
    <div class="panel-footer">
        <a href="#" class="pull-right">View all</a> <h4>Bootply Editor &amp; Code Library</h4>
    </div>
</div>
</div>

<img class="img-responsive mytumb" src="http://placehold.it/150x150/000">

和CSS代码:

.mytumb{
  position:absolute;
  top:50px;
  left:40px;

}

但它适用于静态页面。

我该怎么做？

https://jsfiddle.net/DTcHh/18935/

Answer 1

你可以去这里寻求解决方案position one image above another ，你一定会得到一个解决方案。快乐编码!