Question

在100％时一切都很好，因为我得到的图像滑块的高度为600px，但由于滑块是响应的，它会改变它的大小，我想在任何时候保持这六个DIVS低于它。

DIVS有position: absolute和top: XXpx，以确保它在100％缩放时位于滑块下方。

到目前为止这是有效的，除了我想把它推到右边一点：

<div style="position: absolute; width: 100%; height: 650px; background-color: #FF0000; text-align: center;">
    <img src="theImages/shadow.png" alt="Shadow Footer" id="shadowImage" style="display: block; margin: 0 auto;" />
    <div style="display: block; margin: 0 auto; width 100%; overflow: hidden;">
        <div style="display: inline-block; margin: 0 auto; height: 150px; width: 265px; background-color: #F0F0FF;">
        </div>
        <div style="display: inline-block; margin: 0 auto; height: 150px; width: 265px; background-color: #F0F000;">
        </div>
        <div style="display: inline-block; margin: 0 auto; height: 150px; width: 265px; background-color: #00F0FF;">
        </div>
    </div>
</div>

Answer 1

将身体位置设为相对

Answer 2

我认为您的问题是您将DIV设置为position:absolute ...无论页面缩放如何，它们都会保持相同的位置。也许relative positioning可能是你需要的？

Answer 3

#id div{
    margin-left:100px;
    margin-right:100px;
    margin-bottom:10px;
    margin-top:10px;    
    width:1400px;
}

您可以为所有标签（例如正文）设置div，并将宽度更改为页面的100％。 margin只是为了在身体和div之间留出空间。

如何在页面缩小时将DIV保持在相同位置

3 个答案: