未檢測到高密度設備的移動設備的Foundation4斷點

Question

具體而言，在Samsung Galaxy SIII上測試我的網站時，我看到了爲桌面定義的樣式。

你如何獲得手機使用移動樣式（寬320px）或利用'隱藏小'類等？目前，在那個手機上（我也是用視網膜顯示設備），你不會看到.hide-for-small或全局css被應用，只有媒體查詢更大（768px或更大）的視口。

有沒有人有製作高DPI設備的經驗，即：（-webkit-min-device-pixel-ratio：2）與Foundation4一起工作？

Answer 1

您是否記得包含Viewport元標記？ S3的視口是360x604，所以如果您在縱向視圖中看到的媒體查詢的樣式大於360，則可能會導致視口配置錯誤。我鼓勵下視標籤和@viewport指令（在你的CSS）：

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

@viewport { zoom: 1; }

也看看這個related question上的S3視meta標籤。