移動網站在不同設備寬度上的圖片尺寸

Question

我們如何處理移動網站在不同設備上的圖片尺寸。

Answer 1

響應式設計是答案之一。你可以閱讀更多關於這個概念在這裏http://en.wikipedia.org/wiki/Responsive_web_design

以下是有關課程的響應http://css-tricks.com/which-responsive-images-solution-should-you-use/

製作圖像，並很好的帖子，看看周圍這個網站看看;）CSS - how to make responsive images

Answer 2

我想這取決於關於你在做什麼，但是這樣做之一是把圖像放在一個容器中，然後使它成爲這個寬度的百分比。

例如：

<div id="myContainer"> 
<img id="myImage" src="myImage.jpg"> 
<div> 

然後你的CSS可能是：

#myImage { width: 50%; } 

然後，它會永遠是myContainer中的寬度，這在響應式設計，可能是100％的50％您的視口的最大寬度設置爲桌面瀏覽器，或者可以通過CSS媒體查詢設置。

就高度而言，現代設備瀏覽器會根據確定的寬度成比例地設置它。