使用媒體查詢加載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........"/>