最大寬度對iPhone沒有影響

我試圖讓我的網頁顯示的頁面寬度等於手機屏幕的寬度。所以，例如，html頁面的分辨率就是手機屏幕的分辨率。如果在計算機上查看它，我希望它在側面顯示白色寄宿生。所以，我做這在我的CSS：最大寬度對iPhone沒有影響

html { 
    max-width: 400px; 
    margin: 0 auto; 
}

但隨後的整個頁面只是縮小在iPhone屏幕上，當iPhone的屏幕具有寬度小於400像素少？爲什麼？我怎樣才能解決這個問題？

更新 - 截圖如下。 enter image description here

來源

2013-05-19 Sam Heather

爲什麼不使用寬度：100％？ – BingeBoy

@BingeBoy因爲當在大屏幕（例如平板電腦/電腦）上查看頁面時，我不希望他們看到整個內容放大得非常大。 –

您可以使用媒體查詢並使頁面響應。 – BingeBoy

http://jsfiddle.net/8KwVE/2/

您可以嘗試一個負責任的主題亂搞。

HTML

<head> 
//other stuff 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
</head>

CSS

//iphone is horizontal 
@media only screen and (max-width : 480px) { 
    body{ 
     width:100%; 
    } 
    //other code! 
} 
//iphone is vertical 
@media only screen and (max-width : 320px) { 
    body{ 
     width:100%; 
    } 
    //other code! 
}

來源

2013-05-19 20:27:35 ZZPLKF

最大寬度對iPhone沒有影響

回答

相關問題