iPhone Duo 网页截图指南：尺寸、真实示例与限制
Website Screenshot 团队 · 发布与实测：2026 年 10 月 25 日
要按 iPhone Duo 尺寸截图，粘贴公开网址，选择外屏竖屏（382 × 580）、内屏竖屏（669 × 867）或内屏横屏（951 × 585），再选择视口或整页模式并下载。工具免费，无需注册。这些预设由 Chrome 按网页视口渲染，并非实体 Duo 手机拍摄的截图。
打开 Duo 截图工具从网址或 HTML 开始截图
- 打开 iPhone 截图工具，粘贴可以公开访问的网址。需要复现实验时，使用下方的示例网页。
- 在设备库选择 Duo 外屏竖屏、内屏竖屏或内屏横屏。每次生成使用一个预设，需要对比时手动重复。
- 界面细节可选择无损 PNG，也可选择 JPG、WebP 或 PDF。本文只测量了 PNG 示例，不把图片尺寸结论推广到 PDF 分页。
- 需要一个可见区域时选择 Viewport；需要整个文档时选择 Full page。整页保留所选宽度，高度随内容变化。
- 复现示例时保持 Original 输出尺寸，关闭 Print stylesheet。生成后点击 Download original，在 100% 下检查原文件。编辑器的缩放比例不是导出倍率。
- 也可以打开 HTML 截图工具，在 Manual input → HTML 中粘贴完整源码，清空单独的 CSS 栏，选择同一个 Duo 预设。HTML 模式截取完整文档，PNG 默认请求透明页面背景；需要复现示例的米色背景时，清空样例 CSS 后添加 .page { background: #f5f3ed; }，给内容容器设置背景色。
iPhone 18 Pro 与 Duo：尺寸和真实截图
免费、无需注册。18 Pro 与 Pro Max 用于常规手机布局评审；Duo 外屏用于窄屏导航与首屏检查，内屏竖屏用于较宽内容区，内屏横屏用于多列布局和短高度检查。每次生成选择一个预设，暂不支持一键多设备截图或 ZIP 打包。
| 预设 | CSS 视口 | 输出倍率 | 视口 PNG |
|---|---|---|---|
| iPhone 18 Pro | 402 × 874 | 3× | 1206 × 2622 |
| iPhone 18 Pro Max | 440 × 956 | 3× | 1320 × 2868 |
| iPhone Duo 外屏竖屏 | 382 × 580 | 1× | 382 × 580 |
| iPhone Duo 内屏竖屏 | 669 × 867 | 1× | 669 × 867 |
| iPhone Duo 内屏横屏 | 951 × 585 | 1× | 951 × 585 |
Duo 采用工具栏展开时的小视口高度和 1× 输出。这不是物理屏幕或 App Store 素材尺寸；Chrome 不模拟 Safari、折叠姿态、视口分段或工具栏收起动画。 WebKit 的 Duo 视口说明
同一份源码的真实服务导出
示例为原创虚构页面 Viewport Notes，使用内嵌 CSS、系统字体和 CSS 图形，无需外部资源。以下文件由生产后端根据完整 HTML 实际生成；不是拼接示意图或实体手机截图。窄屏堆叠卡片，较宽视口使用两列或三列。
复现：下载或打开示例网页，选择表中的预设、PNG、Original 输出，关闭 Print stylesheet，等待延时设为 0 ms。网址工具可选视口或整页；HTML 工具始终截取完整文档，不能用它复现单视口裁切。示例生成于 2026 年 10 月 25 日，具体像素和文件大小见各图。
382 × 580 PNG · 40.7 KiB
382 × 2493 PNG · 194.6 KiB
669 × 867 PNG · 87.1 KiB
669 × 1816 PNG · 191.8 KiB
951 × 585 PNG · 62.4 KiB
951 × 1601 PNG · 192.9 KiB
远程服务不会继承本机登录或 Cookie；私有页面、验证码、懒加载、无限滚动和内部滚动容器可能影响结果。整页宽度保留预设值，高度由文档决定，不固定为屏幕高度。
三个 Duo 预设分别适合检查什么
外屏竖屏适合检查窄屏导航、标题换行和首屏操作按钮；内屏竖屏适合检查增加的宽度是否被合理利用；内屏横屏适合检查多列卡片、侧栏，以及横向更宽但高度较短的布局。
示例 Viewport Notes 是原创虚构项目页面，在 600 和 900 CSS 像素处切换卡片列数，不代表客户或设备厂商背书。三张原图展示同一份源码的真实重排。截图可以暴露布局问题，但不能证明按钮、表单或结账流程可用。
视口尺寸、图片像素和 Safari 工具栏高度
CSS 像素决定响应式断点，图片像素还取决于输出倍率。Duo 预设采用 1× 输出，因此视口 PNG 的宽高与设定的 CSS 视口一致；18 Pro 预设采用 3× 输出，不能据此把 Duo 也当成 3×。
这里使用 WebKit 公布的工具栏展开时的小视口高度。Safari 控件收起后可提供更多高度；本工具固定视口，不模拟工具栏动画，也不截取 Safari 控件。物理屏幕分辨率、网页视口和 App Store 素材尺寸是不同概念。
视口截图与整页截图怎样选择
视口截图用于判断一个可见区域能放下什么；整页截图用于查看该宽度下完整文档怎样排版。下方三张整页示例使用相同源码，保持各自预设宽度，延伸到页面末尾。窄屏卡片堆叠、文字换行后，整页通常更高。
整页模式不保证滚完每个内部容器、去除所有固定栏、加载无限信息流或等待全部懒加载资源。适当延时或等待选择器可能有帮助，仍应检查下载原图的底部是否完整。
公开网址、HTML 源码和导出格式
网址模式由远程服务访问公开网页。HTML 模式可以粘贴含内嵌样式的完整文档，也可以上传 HTML 文件。电脑上的图片文件夹和相对路径不会自动上传；请使用公开的绝对资源地址或内联资源。
PNG 适合文字与细线界面；JPG 不支持透明；WebP 是另一种图片选择。工具也提供 PDF，但本文不验证分页效果，也不模拟 Duo 原生折叠状态下的双页 PDF 阅读。Display zoom 只影响编辑器预览。生成图片后可使用 Crop image 裁切；建议先下载原图，裁切后的尺寸不能当作另一种设备预设。
哪些设备行为没有被模拟
后端使用 Chrome 渲染，即使预设带有 iPhone 风格的 user agent，也不是原生 Safari/WebKit。它不模拟铰链、折叠姿态、视口分段、硬件安全区或 Safari 折叠 PDF 阅读器。
本次仅提供表中的三种 Duo 预设。外屏横屏、双窗口分屏和工具栏收起时高度尚无额外命名预设。自定义宽高只能测试矩形布局，不能补上这些设备能力。需要原生行为验证时，请使用实体设备或 Apple 模拟器。
如何做一次可复现的手动对比
保持同一个公开网址、格式和等待设置，依次生成外屏竖屏、内屏竖屏、内屏横屏。分别下载原图并按型号命名，比较导航、换行、网格、固定元素及页面末尾。
本次没有一键多设备截图和 ZIP 打包。做回归评审时，请一起保留网址或源码、预设、模式、日期和原文件。下方可下载的清单记录了示例设置及真实文件尺寸。
Duo 截图常见问题
不注册也能生成 iPhone Duo 网页截图吗？
可以。公开工具免费使用，无需注册，选择一种 Duo 网页视口预设后生成并下载。能否成功仍取决于目标网页和远程服务状态。
Duo 截图来自实体手机上的 Safari 吗？
不是。它是 Chrome 渲染的网页视口预览，不模拟原生 Safari、折叠姿态或实体硬件。
为什么 Duo 视口 PNG 是 1×，18 Pro 却是 3×？
这是当前的输出倍率配置。Duo 每个 CSS 像素对应一个图片像素，18 Pro 对应三个；都不代表本服务拍摄了实体屏幕。
能截取已登录页面或我电脑上的 localhost 吗？
远程服务不会继承你的浏览器登录、Cookie、VPN 或 localhost 访问能力。私有页面、验证码和反爬机制可能阻止截图。
能把三种 Duo 尺寸一次打包成 ZIP 吗？
当前不能。请逐个预设生成并分别下载，本页示例也是独立的真实原文件。
资料来源与实测范围
Duo 视口参考 WebKit 的 Safari 27.1 说明；格式、输出倍率和功能限制描述的是本工具当前实现。原文件及清单来自上述生产服务实测，不代表所有网页的兼容性或加载效果保证。 WebKit: Safari 27.1