媒體查詢不適用於手機瀏覽器？

Question

我目前正在研究一個網站的移動版本，該版本在默認瀏覽器如Firefox & Chrome中運行良好。 Base是流媒體格式，媒體查詢的最大寬度爲440px（@media screen和（max-width：440px），用於定位肖像模式。

字體大小在默認瀏覽器中會隨着其他一些設置較小的圖像和div等。但是，當我在默認瀏覽器上測試我的HTC Android手機上的網站時，它僅顯示最大寬度440的樣式，而不是基於寬度爲480px的正常樣式。這個行爲的問題可以在httpp：//www.seeyouzoeningouda.nl/m

找到移動版本沒有發佈的CSS，因爲我真的不知道代碼的哪一部分顯示給你。 cs s基於默認的HTMl5樣板模板（www.html5boilerplate.com）

Answer 1

移動設備有時以@media handheld爲目標。嘗試使用@media all而不是屏幕。

Answer 2

你用什麼移動設備進行測試？
如果他們是三星Galaxy S3或蘋果iPhone 4，那麼他們的設備分辨率已經翻倍，因此這可能是媒體查詢無法正常工作的原因。

因此，對於I-phone 4，嘗試將最大寬度從480px加倍到960px，如果您在寫入媒體查詢時將最大寬度從360px加倍到720px，那麼對於samsung galaxy s3，它可能工作得很好。

例如。
@media掌機，屏幕（最大寬度：960像素）
@media掌機，屏幕（最大寬度：720像素）

我想這可能會幫助你的目標肖像模式。