我经常像这个页面一样使用带有全宽背景图像的页眉 http://thegreatdiscontent.com/adam-lisagor
您会为背景图像使用哪种媒体查询堆栈? 我希望移动设备使用文件大小不太大的图像,但视网膜设备也有视网膜图像。 因此,也许有一些类似针对视网膜 mac 的大型媒体查询,可能是针对视网膜 ipad 的具有真正压缩图像的视网膜大小的查询。也许一个用于小型移动设备、视网膜和非视网膜……? 它变得非常复杂,当然我不想列出 20 个媒体查询来针对具有不同分辨率和不同(假设的)互联网速度的不同屏幕尺寸。
想法?您会优先使用哪些设备?
谢谢。
最佳答案
我认为您误解了 CSS 媒体查询的意义。他们不会更改正在提供的文件大小。 CSS只是客户端脚本。如果您想为较小的屏幕或较慢的互联网连接提供较小文件大小的图像,您需要在服务器端执行此操作。
看看自适应图像来做到这一点:http://adaptive-images.com/
媒体查询只允许您调整原始图像的大小,因此它仍会加载完整尺寸的图像,然后调整它的大小。
关于css - 对于全 Angular 标题背景图像,您会使用哪种媒体查询堆栈?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19247272/