两个div一上一下不重叠

可以使用CSS中的position属性来控制两个div的位置，例如将上面的div设置为position: absolute; top: 0;，将下面的div设置为position: relative; top: 某个值;，这样两个div就不会重叠了。其中，position: absolute;会使元素脱离文档流，可以通过top、left、right、bottom属性来控制其位置；position: relative;则是相对于自身原来的位置进行定位。

相关问题

如何使两个div不重叠

1. 使用CSS的position属性，将其中一个div设置为absolute或fixed定位，另一个保持默认的static定位。

2. 设置两个div的margin或padding属性，使它们保持一定的距离。

3. 使用CSS的float属性，将其中一个div设置为左浮动或右浮动，另一个div保持默认。

4. 使用CSS的display属性，将其中一个div设置为inline-block或inline，另一个div保持默认的block。

5. 使用CSS的z-index属性，将其中一个div的层级设为更高的值，另一个div的层级设为更低的值。

html两个div重叠

如果您想让两个 `div` 元素重叠，可以使用 CSS 中的 `position` 属性。将它们的 `position` 属性设置为 `absolute` 或 `relative`，并使用 `top`，`left`，`right` 和/或 `bottom` 属性来指定它们相对于其父元素的位置。

例如，以下代码将两个 `div` 元素重叠在一起：

<style>
    .box1 {
        position: absolute;
        top: 0;
        left: 0;
        width: 200px;
        height: 200px;
        background-color: red;
    }
    .box2 {
        position: absolute;
        top: 50px;
        left: 50px;
        width: 200px;
        height: 200px;
        background-color: blue;
    }
</style>

<div class="box1"></div>
<div class="box2"></div>

在上面的代码中，第一个 `div` 元素（红色）的 `position` 属性设置为 `absolute`，并且 `top` 和 `left` 属性设置为 `0`，让它始终位于其父元素的左上角。第二个 `div` 元素（蓝色）的 `top` 和 `left` 属性设置为 `50px`，使其相对于第一个 `div` 元素向下和向右移动。这样，两个 `div` 元素就重叠在一起了。