使用媒体查询加载base64编码图像

Question

我的移动网站上有很多小图片。因此我在CSS中加载base64编码。

<link rel="stylesheet" media="max-resolution: 239dpi" href="small-images-base64.css" />
<link rel="stylesheet" media="min-resolution: 240dpi" href="big-images-base64.css" />

问题是无论如何都会加载small-images-base64.css和big-images-base64.css。有没有办法只加载我真正需要的数据？

Answer 1

只要你链接它们就会一直加载CSS。

一种解决方案是制作更多的css文件，并根据页面加载你需要的文件。

另一个可能是你从CSS中取出图像并直接加载到html中就像...

<img src="data:image/gif;base64,AAAAAAAA........"/>