无论什么设备或分辨率大小，如何将图像固定到屏幕底部

Question

我有一个网站，我需要在可见页面底部居中放置一张图片。因此，在任何屏幕尺寸下，图像仍将位于底部并居中。我已经尝试过其他 Stack Overflow 线程，但似乎找不到真正将其保持在底部的东西。

position:fixed;
bottom:0px;
left:50%;

这不起作用。

Answer 1

看起来您可能确实想要一个固定位置，以便在您滚动时 div 会随着您向下滚动，但您可能需要添加有关您尝试居中的 div 的更多信息。我是否正确假设 div 在您滚动但未正确居中时跟随？

如果是这种情况，我的猜测是因为您的边距没有考虑到您试图放在屏幕中间的 div 的高度和宽度。如果你有一个宽度为 100px 的对象，你需要从左边距减去一半，这样 div 才能真正到达屏幕的中心。更多上下文会有所帮助，但希望这能给你一些工作。

在这个例子中，你的 div 看起来像这样：

.center-bottom {
  position:fixed;
  bottom:0px;
  left:50%;
  width: 100px;
  margin-left: -50px;
}