CSS中的重叠元素 [英] Overlapping elements in CSS

问题描述

如何在CSS中重叠两个元素，例如

How can I make two elements overlap in CSS, e.g.

<div>Content 1</div>
<div>Content 2</div>

我想要两个内容（它们可以是任何东西）重叠，在与内容1相同的左上角，它们显示重叠。内容1应该从文档的正常流程开始，而不是在屏幕上的某个固定位置。

I would like the two contents (they can be anything) to overlap, so Content 2 is displayed starting at the same top left corner as Content 1 and they appear overlapped. Content 1 should begin in the normal flow of the document and not at some fixed position on the screen.

这是否可能？

谢谢，

AJ

推荐答案

方法是在两个元素上使用 position：absolute 。您可以相对于页面绝对定位，也可以通过将容器div设置为 position：relative

the easiest way is to use position:absolute on both elements. You can absolutely position relative to the page, or you can absolutely position relative to a container div by setting the container div to position:relative

<div id="container" style="position:relative;">
    <div id="div1" style="position:absolute; top:0; left:0;"></div>
    <div id="div2" style="position:absolute; top:0; left:0;"></div>
</div>

这篇关于CSS中的重叠元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！