html - 如何将多个 div 标签放置在彼此之上

Question

我在将 3 个不同的 div 标签放置在彼此之上时遇到问题。最初它们应该重叠，但实际上它们一个位于另一个下方，我正在努力避免这种情况。

有人可以建议我如何将所有 3 个位置放在一个点上吗？

这是我使用的 CSS:

#menudiv{
height:225px;
width:900px;
background-image:url(images/menu1.jpg);
}

#menudiv2{
height:225px;
width:900px;
background-image:url(images/menu3.jpg);
visibility:hidden;
}


#menudiv3{
height:225px;
width:900px;
background-image:url(images/menu2.jpg);
visibility:hidden;
 }


#tableMenuDiv{
position:absolute;
width:100px;
height:225px;
left:53px;
top:137px;
 }

这是我将它们放在页面中的 html 代码:

<td width="900px" align="left">

<div id="menudiv"></div>
<div id="menudiv2"></div>
<div id="menudiv3"></div>

<div id="tableMenuDiv">
</td>

Answer 1

您需要将 div 从正常流中移除，而不是将它们的可见性设置为隐藏。为此，请在它们上设置 position: absolute;。