如何將一個圖像浮動在另一個圖像之上？

Question

我已經在這個主題上進行了一些搜索，但是似乎找不到我正在尋找的答案。
我試圖在我的網站上設置橫幅廣告（728 x 90），以便將其“放置”在具有背景圖像的div上。 因此，如果有人使用廣告攔截器，他們會在廣告應顯示的​​位置看到顯示“請禁用您的廣告攔截器”的圖像。

我當前的代碼是這樣的：

<div style="float: left; background-image: url(../forum/banners/replacement.png); height: 90px; width: 728px; border: 1px solid black;">
</div>
<!-- BEGIN SMOWTION TAG - 728x90 - DO NOT MODIFY -->
    <script type="text/javascript">
    <!-- ad code goes here -->
    </script>
<!-- END SMOWTION TAG - 728x90 - DO NOT MODIFY -->

但是，這會使廣告顯示在div下，而不是在廣告上顯示“覆蓋”。 如何才能使廣告和div不會被裁剪？

Answer 1

父位置relative ，然后孩子們absolute ....

#Container {
    position: relative;
}

.Children {
    position: absolute;
    top: 0px
    left: 0px
}

絕對值是相對於父級“相對”的-因此子級的寬度為0px，父級向下為0px-即覆蓋

<div id="Container">
    <img class="Children" src="..."/>
    <img class="Children" src="..."/>
</div>