Question

我试图将div叠加在另一个上，然后我发现了this

但这似乎对我有用吗？

我只想要它：

<div>The div below</div>
<div>OverLay div</div>

你可以给我一个工作演示吗？

Answer 1

这是一个小提琴：http://jsfiddle.net/maniator/J9bjm/

您唯一需要掌握的是position: absolute;和top: 0;（或者您想要它远离页面顶部）

Answer 2

第一个答案对我来说似乎很好，但这里是 ~~w3schools css position~~ 页面的链接。 “自己尝试”是一个方便的沙箱。

编辑：如评论中所述，w3schools不是一个很好的参考。我用strikethrough标记了链接，但保留了它。

Answer 3

这是另一种可能适用于您的特定情况的解决方案，使用负边距而不是位置：

<div id="one">One</div>
<div id="two">Two</div>

#one, #two, #three, #four {
    background: #ddd;
    height: 100px;
    width: 100px;
}
#two {
    background: #aaa;
    margin-left: 10px; /* Set to 0 for complete overlap */
    margin-top: -80px; /* Set to -100 for complete overlap */
}

http://jsfiddle.net/xatpf/

Answer 4

根据HTML的结构，您可能甚至不需要jquery来执行此操作。如果您确切知道它们在窗口中的确切位置，则可以在它们上使用position: absolute; CSS。 This page很好地解释了如何以不同的方式使用position CSS属性来定位div，但是你可能会喜欢。

编辑：我用

编辑了小提琴

body{
padding:0px;
}

要使它们在顶部对齐，默认情况下窗口会有一些填充，这会影响position: absolute;上没有的任何内容

jquery css覆盖另一个div的div？

4 个答案: