html - Bootstrap 将一张图片放在另一张图片上？

Question

我在我的页面上创建了一个 col-md-3，并在其中放置了 .png 图片和表格。我已经将图片分成两部分，我想让第一张图片旋转，但我无法将两张图片放在一起。当我尝试将它们放在 table 上方时，它们一个接一个地放在 table 上方，或者当我调整页面大小时，它们看起来不像应该的样子。当前第一张图片在第二张图片上方。

有什么建议可以定位它们吗？这是代码:

<div class="col-md-3" style="padding-bottom: 10px; margin-bottom: 50px;">
    <img class="img-responsive" src="img/other/sch1.png">
    <img class="img-responsive" src="img/other/sch2.png">
    <table id="contesttable" class="table" style="text-align: center;">
    ..........
    </table>
</div>

Answer 1

试试这个:(style="position:absolute;")

    <div class="col-md-3" style="padding-bottom: 10px; margin-bottom: 50px;">
                    <img class="img-responsive"  style="position:absolute;" src="img/other/sch1.png">
                    <img class="img-responsive"  style="position:absolute;" src="img/other/sch2.png">
                    <table id="contesttable" class="table" style="text-align: center;">
                        ..........
                    </table>

</div> 

https://jsfiddle.net/oLo2psLn/ enter link description here

然后你可以在你的样式中使用:z-index:1;或 z-index:2;这将选择哪个图像在顶部，较高的值在顶部:因此 2 在 1 之上。