【问题标题】:Faking max-device-width伪造最大设备宽度
【发布时间】:2011-09-03 04:42:56
【问题描述】:

要实现移动网站,在我的浏览器中设置 max-device-width 会很有用。 我知道伪造用户代理的插件。最大设备宽度也可以吗? 我更喜欢使用普通的浏览器,比如 Firefox、IE、Opera ……而不是各种移动浏览器模拟器,甚至是不同的智能手机。

谢谢, 罗波

【问题讨论】:

标签: javascript css plugins browser mobile-website


【解决方案1】:

在常见情况下,桌面浏览器可用于 html 和 css 的健全性检查,但移动浏览器在 html、css 和 javascript 处理方面有很大不同。

“模拟” max-device-width,您可以将max-device-width 替换为max-width 并将浏览器窗口调整为所需大小(实际版本的浏览器支持max-width 媒体查询指令)。

我们在移动网络界面开发的早期阶段使用桌面浏览器,后期使用模拟器。 UI 测试人员仅使用真实设备。

【讨论】:

  • 这实际上对我不起作用。我在 Firefox 中更改了我的用户代理字符串并使浏览器变得非常窄,但我的网站仍然在我的笔记本电脑上以全屏版本和我的 iPhone 上的 max-device-width 480 呈现。
  • 你能提供html和css你用的是什么吗?
  • 凯文是对的,这行不通。 max-width,这可能是您正在考虑的,Phillip,与 max-device-width 是分开的。我知道模拟这一点的唯一方法是根据情况临时或永久更改您的代码以使用最大宽度。这不是一个完美的模拟,尤其是在设备旋转方面,但它通常足以应付大多数测试。另外,请查看此书签:benjaminkeen.com/misc/bricss
  • 对不起。写答案时,我想到了max-width。是的,在资源调试时max-device-width可以替换为max-width。我已经确定了答案,谢谢。
【解决方案2】:

Chrome 允许您设置设备指标,这些指标用于设备宽度的媒体查询计算。为此,请打开开发者工具,点击右下角的齿轮图标,然后转到 Overrides 选项卡。

2014 年 1 月 17 日编辑:Chrome 现在有一个仿真标签,可以在开发者工具中的控制台旁边找到。

【讨论】:

    猜你喜欢
    • 2013-09-01
    • 2017-03-20
    • 2017-01-07
    • 2012-12-12
    • 2014-03-26
    • 2011-10-08
    • 1970-01-01
    相关资源
    最近更新 更多