iPad始終假定縱向寬度爲最大寬度

我正在構建一個具有3種尺寸的反應網站。最大480px，最大768px，最大1024px +; 但是，使用iPad時出現問題。在Galaxy Tab 10.1中，它的功能就像是一種魅力，在我的瀏覽器中它的效果也不錯。但是似乎每當我使用iPad時，似乎都認爲最大寬度是768px。iPad始終假定縱向寬度爲最大寬度

這就是我的意思是： Explenation

這是我的代碼：

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1"> 
<title>Insert title here</title> 
<meta name="viewport" content="width=device-width, user-scalable=no" /> 
</head> 
<style type="text/css"> 

body { 
    background-color: red; 
} 

@media screen and (max-width: 480px) { 
    body { 
     background-color: green; 
    } 
} 

@media screen and (min-width: 481px) and (max-width: 1023px) { 
    body { 
     background-color: brown; 
    } 
} 

@media screen and (min-width: 1023px) { 
    body { 
     background-color: blue; 
    } 
} 

</style> 
<body> 
<div class="color"> 
    Some color 
</div> 
</body> 
</html>

雖然我的要求並不包括iPad支持，我也想支持它。

來源

2012-11-09 Paul Peelen

這可能與'max-scale'，'min-scale'和'initial-scale'有關 - 嘗試將所有這些設置爲1，看看是否有任何變化。當您旋轉iPad時，它不會更改視口，而是會縮放內容。在橫向工作中重新加載頁面嗎？ –

acutally做了很多幫助，我仍然在頁面右側有一個白色的邊框，但我可以忍受。添加是作爲答案，我會批准它。 –

這可能與最大規模，最小規模和初始規模有關 - 嘗試將所有這些設置爲1並查看是否有任何更改。

缺點是iOS用戶將無法捏縮放您的頁面。

當您旋轉iPad時，它不會更改視口，而是會縮放內容。 Allen Pike有一個很好的解釋。

來源

2012-11-09 12:15:53

iPad始終假定縱向寬度爲最大寬度

回答

相關問題