设备屏幕分辨率参考

怎么用

1. 在搜索设备中输入名称关键字，如 iPhone、Pixel 或 iPad。
2. 选择分类：全部、手机、平板、笔记本或显示器。
3. 读取表格中的物理分辨率、逻辑 CSS 像素、DPR 与浏览器视口。
4. 改完筛选条件后点击筛选，用复制把当前过滤出的表格复制为文本。

常见用途

• 断点规划 —— 确认布局要覆盖哪些逻辑像素宽度。
• 图片尺寸 —— 用 CSS 像素乘以 DPR 决定首屏大图的导出尺寸。
• 设备测试 —— 用模拟器的指标对照真机的公开规格。
• 规格说明 —— 在设计文档里引用某个设备的精确 CSS 像素数值。

常见问题

问：DPR 是什么？ 答：设备像素比，即一个 CSS 像素对应多少个物理像素。DPR 为 3 时，300 px 的 CSS 方块覆盖 900 个物理像素，线条与文字因此更锐利。

问：为什么逻辑宽度不是物理宽度除以 DPR？ 答：正是这个关系，但厂商会把结果取整到 CSS 网格上，所以公布的逻辑尺寸与直接相除可能相差一两个像素。

问：视口和屏幕有什么区别？ 答：视口是页面在浏览器窗口里实际拿到的区域，扣掉浏览器边框与系统栏后比屏幕小。笔记本与显示器还会随窗口大小变化。

问：数据有多新？ 答：表中都是各设备广泛记录的公开参数。厂商有时会为不同地区换面板，请把它当作规划参考，而非经销商口径。