background-size：覆盖导致背景图像部分隐藏

Question

我正在尝试做一个简单的着陆页，我有一个标题，内容div带有背景图片和页脚。我希望它具有响应性，所以为了保持大小，我使用了background-image:cover。现在的问题是，在不同的屏幕上，图像需要放大以至于其中的一部分被隐藏，如下所示：

正如您所注意到的，部分文字已被删除。请问有什么想法吗？

Answer 1

正如BenM所说，你必须在

之间做出选择

1）扭曲图像

2）使用封面

剪裁它

3）使用contains保留两侧的空白区域。

但是，如果你的问题主要是必须始终显示图像的底部，你可以设置background-position-y：100％;

这将确保始终显示图像的底部（但会在顶部切割更多...）