解决vue项目背景图片在IE和火狐上不显示的问题

问题描述：

在开发平台首页时，发现首页的背景图老是不显示，且仅限在IE内核的浏览器和火狐浏览器，例如谷歌或者遨游的谷歌内核浏览器内可以正常显示，遨游浏览器切换到IE内核时却不显示了。简直是怪事；

问题分析：

开始都是从打包角度去考虑，以为是打包路劲问题，其他背景图正常，唯独这张背景图不显示，后来考虑是背景图有问题，换可以正常显示的背景图，发现也不显示，又发现该背景图在开发环境中在火狐和IE下一样不显示，最终确定是样式的兼容性问题；

在火狐中请求接口报304，查阅资料为什么会报304：‘

 当客户端缓存了目标资源但不确定该缓存资源是否是最新版本的时候, 就会发送一个条件请求。在进行条件请求时,客户端会提供给服务器一个If-Modified-Since请求头,其值为服务器上次返回响应头中Last-Modified值,还会提供一个If-None-Match请求头,值为服务器上次返回的ETag响应头的值。

        服务器会读取到这两个请求头中的值,判断出客户端缓存的资源是否是最新的,如果是的话,服务器就会返回HTTP/304 Not Modified响应头, 但没有响应体.客户端收到304响应后,就会从本地缓存中读取对应的资源。 所以：当访问资源出现304访问的情况下其实就是先在本地缓存了访问的资源。

勾选下面的禁用缓存，则报200

查看代码发现：

height设置100%和position定位放在一起使用，则会导致这种背景图在IE内核和火狐浏览器中不显示的情况发生

（备注：也许在你们项目中这么写并没有问题，那说明这种情况的发生也许还有其他特定环境，不要太纠结，防止有些人自己去测试：‘可以显示啊！你个骗子’，影响各位老爷的心情）

解决办法：

把height设置为固定高度，或者不使用绝对定位，或者即设置固定高度又不使用绝对定位，三者选一