Question

我需要在显示数据行（动态）后在网页底部显示图像。

见图

我有以下HTML代码;

<div id="wrapper">
<body topmargin="0" leftmargin="0" rightmargin="0" marginheight="0" marginwidth="0" SCROLL="no" >
<div class="data_area">
// rows of data. could be between 1 and 10 rows.
</div>

<div class="logoImage">
    <div class="wrapperImage">
    <img src="../../images/imagee.png" width="289"     height="143" />
    <div class="TodaysDate"><?php echo $ToDayDate;?></div>
    </div>
</div>
</body>
</div>

css：

#wrapper {
    width: 1080px;
    position: relative;
}

.data_area {
    min-height: 120px;
    width: 100%;
    clear: left;
    float: left;
}

.logoImage {
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 10px;
}

.wrapperImage {
    text-align: center;
    vertical-align: middle;
}

即使只有一行数据，我也需要将图片div保留在页面底部。

Answer 1

您可以使用absolute定位吗？你可以这样做：

.logoImage {
    position: absolute;
    bottom: 25px;
}

这是你想要的效果吗？

或者，如果您希望在用户滚动时将其固定，并将其从底部保留25px：

.logoImage {
    position: fixed;
    bottom: 25px;
}

Answer 2

如果您始终希望看到自己的div位于屏幕顶部。你需要把那个div定位为固定的。它的父div必须保持相对位置。

.logoImage {
    position: fixed;
    bottom: 25px;
}

你的问题不是很清楚。但也许这可以解决你的问题。

将div放在屏幕底部另一个div x像素下方

2 个答案: