在Android瀏覽器中顯示HTML中指定的元素大小的CSS

如何在Android瀏覽器中顯示尺寸爲1.5 x 2.5英寸的元素？讓我們考慮下面的html。在Android瀏覽器中顯示HTML中指定的元素大小的CSS

在我的臺式電腦上，瀏覽器在一個「正常」大小的窗口中，它顯示2行內容，每個塊的大小爲1.5 x 2.5英寸，如html中所指定的。當我將瀏覽器的窗口變小時，爲了與智能手機的尺寸相對應，所以每行有一個或兩個塊，每個塊的大小爲1.5 x 2.5英寸。這正是我希望在我的智能手機上看到它的原因。

不幸的是，在智能手機（缺省設置爲Android 4.0的瀏覽器）中，我看到2行內容，每個塊的大小約爲0.5 x 0.8英寸。即它就像正常大小的桌面縮小到一個小巧的智能手機屏幕 - 這不是我想要的。我希望看到CSS中指定的大小爲1.5 x 2.5英寸的塊。

是否可能有一些meta標籤向android表示該頁面是爲移動設備設計的，以便Android不會嘗試對其進行一些「桌面站點」優化？

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"/> 
    <title>Test</title> 
    <style> 
    div { 
     display: inline-block; 
     width: 1.5in; 
     height: 2.5in; 
     background: #AAAAAA; 
     margin: 1em 1em; 
    } 
    </style> 
</head> 
<body> 
    <div></div><div></div><div></div><div></div><div></div> 
    <div></div><div></div><div></div><div></div><div></div> 
</body> 
</html>

來源

2013-12-09 David L.

的問題是通過將這一指令頭部分解決：

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

最終我發現這裏隱藏的答案： Media Query and Android Device 和Media queries not behaving as expected on Android

來源

2013-12-09 13:30:30

在Android瀏覽器中顯示HTML中指定的元素大小的CSS

回答

相關問題