2

我在华为 Ascend Y330/Android 4.2 中使用六种不同的浏览器测试了媒体查询,得到了 mqtest.io 报告的三种不同的设备宽度结果。

对于每个浏览器,然后我使用 css 在我自己的 html 页面上测试了实际断点,例如: @media only screen and (max-device-width: 320px)-- 并通过更改像素值直到出现格式更改。所有六种情况下的设备宽度都与 mqtest.io 报告的设备一致。

显然,问题是由于浏览器不一致而无法控制设计。这是“本地”问题还是使用时的一般问题@media

根据 mqtest.io 和网页测试的结果

Dolphin 和 Android 默认浏览器
device-width: 480px
device-height: 800px

Opera 和 Google Chrome
设备宽度
:320 像素设备高度:534 像素

Firefox 和 Firefox Beta
设备宽度
:320 像素设备高度:533 像素

屏幕:480x800
像素比:1.5(由 mqtest.io 报告的所有六种浏览器)

4

2 回答 2

0

以下代码是否解决了这个问题?

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;" />
于 2015-08-09T12:05:03.700 回答
0

我在测试页面中有该代码,但它没有帮助。此外,我又进行了一些测试,很明显 device-width 根本是不可预测的。谢谢你的回答。

于 2015-08-10T02:48:37.773 回答