Question

我已经完成了stackoverflow中的所有相关答案，但还没有找到完美契合。无论用户如何尝试调整浏览器大小，我都试图让.background img符合用户的浏览器大小。一些相关问题是：

我正在尝试创建一个类似于此站点的效果（在Bootstrap官方网站上提到它作为示例）：http://riot.design/en/。尝试调整浏览器的大小，你会发现背景img总是可以缩放和适合。

有没有一种很好的方法来实现这种效果？

Answer 1

你可以在你的CSS中尝试这样的事情。

html { 
  background: url(http://7-themes.com/data_images/out/60/6975736-   
android-background.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

您可以选择多种选择.. 只是尝试在这里遵循它们，满足您的需求。 https://css-tricks.com/perfect-full-page-background-image/

Answer 2

当我做in this answer时，litlitDM打败了我。我的代码与他/她的代码略有不同。确保网址为单引号或双引号。使用litlitDM提供的后备总是一个好主意。我喜欢使用{{1}}，但如前所述，css-tricks是一个很好的资源，因为有很多方法可以做到这一点。

将背景img缩放到用户的浏览器大小

2 个答案: