屏幕分辨率与宽高比速查表 - 全平台设备分辨率对照大全
做响应式设计,本质是为一批不同视口布局,而不是只对自己的笔记本。本表按手机、平板、笔记本、显示器、电视分组,列出常见物理分辨率与宽高比,并区分物理像素与 CSS 像素。设计断点时、给视频选 16:9 还是 9:16 时、和产品对齐"至少要覆盖哪些机型"时,都能拿来对标真实设备,避免凭感觉拍脑袋。
手机分辨率 10
320 × 480iPhone 3GS (3:2)
640 × 960iPhone 4/4S (3:2 @2x)
750 × 1334iPhone 6/7/8 (16:9 @2x)
1080 × 1920iPhone 6/7/8 Plus (16:9 @3x)
1125 × 2436iPhone X/XS (19.5:9 @3x)
1170 × 2532iPhone 12/13/14 (19.5:9 @3x)
1290 × 2796iPhone 14 Pro Max (19.5:9 @3x)
720 × 1280Android 720p (16:9)
1080 × 1920Android 1080p (16:9)
1440 × 2560Android 1440p (16:9)
平板分辨率 5
768 × 1024iPad mini / iPad (4:3)
1536 × 2048iPad Retina (4:3 @2x)
1668 × 2388iPad Pro 11" (4:3 @2x)
2048 × 2732iPad Pro 12.9" (4:3 @2x)
1600 × 2560Android 平板 (16:10)
笔记本分辨率 6
1366 × 76813" 笔记本 (16:9)
1440 × 900MacBook Air 11" (16:10)
1920 × 1080Full HD 笔记本 (16:9)
2560 × 1600MacBook Pro 13" Retina (16:10 @2x)
3024 × 1964MacBook Pro 14" (16:10 @2x)
3456 × 2234MacBook Pro 16" (16:10 @2x)
显示器分辨率 6
1280 × 720HD 720p (16:9)
1920 × 1080Full HD 1080p (16:9)
2560 × 1440QHD 1440p (16:9)
3840 × 21604K UHD 2160p (16:9)
5120 × 28805K (16:9)
7680 × 43208K UHD 4320p (16:9)
电视分辨率 4
1280 × 720720p HD (16:9)
1920 × 10801080p Full HD (16:9)
3840 × 21604K UHD (16:9)
7680 × 43208K UHD (16:9)
常见宽高比 7
1:1正方形(Instagram 帖子)
4:3传统电视、iPad
16:9宽屏电视、YouTube 视频
16:10MacBook、部分显示器
21:9超宽屏显示器、电影
9:16竖屏视频(TikTok、Reels)
1:1.91Facebook 链接预览
提示
- Retina 显示器的物理分辨率是逻辑分辨率的 2x 或 3x,CSS 中使用逻辑分辨率。
- 响应式设计断点常用:320px (手机)、768px (平板)、1024px (小屏笔记本)、1280px (桌面)。
- 视频制作时 16:9 是标准宽高比,社交媒体可能需要 1:1 或 9:16。
- 使用 viewport meta 标签和媒体查询适配不同设备。
- 设计稿通常按 2x 或 3x 输出,开发时除以倍率得到 CSS 尺寸。
常见问题
常见手机屏幕分辨率有哪些?
手机常见如 1080×1920(FHD)、1440×2560(QHD)、2340×1080 等;平板如 2048×1536(iPad)、2560×1600;笔记本常见 1920×1080、2560×1440;显示器从 1920×1080 起步、4K 为 3840×2160;电视多为 3840×2160。本页按手机、平板、笔记本、显示器、电视分组列出物理分辨率与宽高比,并区分物理像素与 CSS 像素。
物理像素和 CSS 像素有什么区别?
物理像素是屏幕真实发光点;CSS 像素是浏览器布局用的逻辑单位,二者由 device pixel ratio(DPR)换算。写响应式时按 CSS 像素设计,再用 DPR 适配高清屏,避免在高 DPR 设备上元素显得过小。
做响应式设计怎么定断点?
按真实设备的视口宽度分组取代表性断点(如手机 ≤480、平板 ≤1024、笔记本或桌面 >1024),而不是只对自己的笔记本调。给视频选比例时,横屏用 16:9、竖屏短视频用 9:16。
16:9 和 9:16 怎么选?
横屏内容(电影、会议录屏、桌面演示)用 16:9;竖屏短视频(手机全屏观看)用 9:16。选错比例会导致上下或左右黑边。本页列出了各设备的常见宽高比可直接对标。
由 巧匠 维护
公开更新于 2026年7月21日,内容持续校对官方文档。