有没有办法使HTML div像body标签一样起作用?

时间:2019-11-22 01:14:11

标签: javascript html css

我正在尝试使div的行为类似于body标签。通过这种方式,我的意思是如果我的图像样式如下:

img {
    position: absolute;
    bottom: 0px;
}

然后将其放置在div的底部而不是整个页面的底部。有什么办法可以做到这一点?我不能阻止div中的元素轻松地进行绝对定位(这是我正在基于Web的游戏中使用的游戏引擎的预览窗口,用户可以在其中定制元素的CSS)。谢谢。

2 个答案:

答案 0 :(得分:2)

其位于页面底部的原因是,您当前的代码告诉图像绝对位于其父级,在这种情况下,它是您的主要html,因为未设置任何HTML

因此,通过将其设置为position: relative,将包含该图像的div设置为父图像。当您这样做时,现在图像将绝对放置在包含div的父图像上。

例如;

<div class="img-container">
 <img src="blablabla.jpg">
</div>

.img-container {
 position: relative;
}

.img-container img {
  position: absolute;
  bottom: 0px;
}

答案 1 :(得分:0)

是的,只需将position: relative添加到包裹img的任何元素上,它将放置在该元素的底部。引用此W3Schools lesson