css - 背景大小：覆盖较小的 DIV

Question

众所周知，using background-size: cover使背景图像在浏览器的视口上自动完美缩放。

虽然，如果我们将它应用到具有较小尺寸的 DIV（例如 100x100px）上，图像仍会缩放，而不是基于容器 DIV，而是基于整个浏览器的视口，从而导致仅显示图像的一部分。

是否有任何解决方法，而不考虑background-size: 100% 100%，这并不能通过保持比例来真正扩展它？

在background-size: cover不使用 JS 或任何服务器端修改的情况下进行简单的调整大小非常有用。

提前致谢。

Answer 1

我很确定你想要的是什么background-size: contain。

Answer 2

评论的副本，以便海报可以接受：

尝试不使用固定的:) jsfiddle.net/vnMeK

请注意，并非所有浏览器都支持此功能，IE 有一个半工作过滤器。