如何让一张图片不重复铺满整个浏览器？

Question

我把宽高都设为100%，backgroud-size：cover，图片也设置了不重复，但是没有看到效果浏览器缩小后图片并没有铺满整个网页，请教大神正确的该怎么写？谢谢！！

Answer 1

要让容器与浏览器宽度，高度相等，可以通过设置html, body的width, height都为100%，然后用body来设置背景图片。也可以通过js自动调整容器的width与height。还有就是我最爱的下面神单位vw, vh。

background-position: center center;
background-size: cover;
background-repeat: no-repeat;
width: 100vw;  // 这个设置容器宽度为浏览器宽度
height: 100vh; // 这个设置容器高度为浏览器高度

Answer 2

http://115.159.106.238/login.html
请参照源代码（http://115.159.106.238/login.js里的resizefunction）。
完美的平铺是需要JS代码实现的，不是单纯CSS就能搞定的问题。

Answer 3

background-size:100%;
background-repeat:no-repeat;

Answer 4

什么浏览器呀
可以直接把背景图片给body，调一下样式，不过在ie下好像会有问题。
或者直接放一个绝对定位的div，把图片放进去，z-index：-1；这样绝对也不会有兼容的问题。腾讯空间欢迎的背景图片就是这样做的（单页就是，高度不能有进度条）。