如何让HTML页面中的背景图片自适应浏览器高度和宽度（电脑高度和宽度）

如何让HTML页面中的背景图片自适应浏览器高度和宽度（电脑高度和宽度）

在今天做项目的时候突然遇到一个问题，我给一个页面加一个背景图片，直接放进去被拉大了，如图所示：

虽然我可以用PS做成我自己的电脑宽度，但是我换一台别人的电脑（分辨率不一样）显示的图片大小完全不一样。

如何解决这个问题呢？

我首先是写css样式，在百度 查阅css3文档，使用background-size: cover;即可，我接着就试了一下：

结果显示的是：

这样的话最新浏览器显示没啥问题，但是有的图片高度不会撑满全部，最终解决方案：

这样就完美实现了。无论是换一台不同分辨率的电脑还是调整浏览器比例，背景图片的大小永远都不会改变了。

i