設置window.innerHeight

Question

是否有人可以解釋我爲什麼不設置height視屬性：

<meta name="viewport" content="width=480px, height=120px">

不起作用？ window.innerWidth報告480px但是window.innerHeight 210，而不僅僅是120px！因此，設置height屬性有什麼意義？

Answer 1

那麼，因爲沒有高度，這應該用於設備支持，而不是用於定義具有媒體查詢的特定大小。

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
http://www.w3schools.com/css/css_rwd_viewport.asp 

Answer 2

正如上面提到的評論，你sopposed添加寬/ heigth 沒有的PX - 下面的例子

<meta name="viewport" content="width=500, initial-scale=1"> 

但要知道，一個像素不取決於最終用戶設備的像素

快速閱讀閱讀本文：

https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

另外一個關於像素裁判是不是像素

http://www.quirksmode.org/blog/archives/2010/04/a_pixel_is_not.html

---

編輯：確定 - 也許我現在得到了你的問題。在玩弄我注意到的視口道具的同時，也許你的瀏覽器緩存在你進行大量測試的時候對你起了一個詭計。 -ofc不確定你是否在測試時沒有清除它。 - !!!如果您在非移動設備上進行測試，請閱讀END上的NOTE！

但給你一個簡單的例子是以下變化的東西：

<meta name="viewport" content="height=50"> 

你應該看看下面的3個網站我爲你設置：

所有具有以下DIV：

div{ 
    width: 60px; 
    height: 60px; 
    background-color: #000; 
} 

http://testcode.de/test/1.html

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 

http://testcode.de/test/2.html

<meta name="viewport" content="width=device-width, initial-scale=2.0"> 

http://testcode.de/test/3.html

<meta name="viewport" content="height=50"> 

注：視口，這給出了關於視口的初始大小的大小的提示，由若干移動設備僅使用。

OFC - 您應該使用移動設備來測試它！ 如果您使用了普通瀏覽器 - 這是您的答案！