在手机屏幕上预览任意网站
输入网址并选择手机。页面会在带有该设备真实屏幕尺寸和移动浏览器地址栏的外框中打开,因此响应式布局的切换与真机完全一致。
网站将显示在这里
扩展程序的效果好得多
在线工具适合快速看一眼。Chrome 扩展程序在你自己的浏览器里完成同样的事,没有外框的限制:任何网站都能打开,并使用真实的移动端 User Agent 和设备屏幕参数。
在线工具与扩展程序
同样的预览在你的浏览器内运行时有什么不同。
| 在线工具 | 扩展程序 | |
|---|---|---|
| 禁止嵌入的网站 | 不显示,并说明原因 | 正常打开 |
| 移动端 User Agent | 使用桌面浏览器的,只有宽度变化 | 真实的移动端 User Agent |
| 像素比与触控 | 仅屏幕尺寸 | 模拟尺寸、像素比和触控点 |
| localhost 与未加密 http | 不可用 | 可用 |
| 登录与 Cookie | 在框内常受限制 | 与普通标签页表现一致 |
| 双设备与截图 | 没有 | 双设备并排显示,一键截图 |
为什么网站在这里可能显示不同
- 外框运行在你的桌面浏览器中。随屏幕宽度自适应的布局与真机表现一致,但在服务器端选择移动版本的网站可能会显示桌面版。
- 有些网站禁止被嵌入。我们会检测并说明原因,而不是显示一个空框。
- 登录、Cookie 提示和嵌入的小组件可能表现不同,因为浏览器会限制框内的 Cookie 和存储。
- 这里没有触控输入,也没有真实手机的性能。重要流程请在真机上确认。
- localhost、需要登录或未加密 http 的页面需要使用 Mobile View Extension。