如何更改窗口大小變小時的src或多個圖像

Question

我想知道如何更改多個圖像的來源，當用戶更改瀏覽器窗口的大小或他們正在使用IPAD？

Answer 1

你可以用純CSS做到這一點，使用CSS media queries。如果在某些塊元素上使用背景圖像，您可以通過向其公共容器添加/刪除類（基於媒體查詢 - 因此可用客戶區），輕鬆地交換尺寸和背景圖像，而不是使用<img>元素作爲圖像。 。

Answer 2

那麼，如果用戶調整瀏覽器大小，圖像已經加載，所以不需要加載較小的版本。

如果他們使用的是較小的設備，例如ipad或iphone，則可以檢測到並重定向到不同的頁面，其中該設備的圖像大小正確，例如ipad.example.com，m.example.com等。

Answer 3

你可以用css3媒體查詢來做到這一點。看看這篇文章smashing magazine