如何跨移動設備提供圖片

我正在爲移動設備（智能手機和平板電腦）開發網頁。如何跨移動設備提供圖片

我正在使用jQueryMobile，因此大多數功能在所有設備上都能很好地工作。

我的問題是，我想使用非常高分辨率的圖像，以使用平板電腦獲得最佳質量。如果我使用720X1280 - 平板電腦頁面看起來不錯 - 但在智能手機上 - 不會發生縮小。

是否必須使用320x480構建 - 然後縮放會發生在平板電腦上？有沒有靈魂或準則？

使用響應式圖像。這樣圖像將根據設備的大小進行縮放。

img { 
    width: 100%; 
    max-width: 100%; 
}

上面的css代碼會自動取父容器的大小。

這裏有一些很棒的例子& aticles。

的Javascript插件自適應圖像：

靈活的圖像偉大的教程：

2012-06-13 07:28:17 SVS

擁有'width'和'max-width'不是多餘的嗎？ –

當您使圖像響應時，不需要最大寬度+，不要忘記將高度設置爲「自動」，否則在某些瀏覽器中不會看到圖像 –

+1有用的粉碎雜誌文章 –

回答