Android 视口尺寸完整指南
这份综合指南提供了热门Android设备的详细视口尺寸和屏幕分辨率。对于开发响应式网站和应用程序的网页开发者和设计师来说是必不可少的信息。
数据状态: 最近更新:2026-02-08(UTC)
数据来源: Apple、Google、Samsung 官方规格页面
计算口径: iPhone 和 iPad 主要按分辨率除以 DPR 计算。Android 的 CSS 视口和 DPR 会受显示缩放、浏览器 UI 与系统设置影响。
视口尺寸表
| 机型 | 视口尺寸 | 屏幕分辨率 | DPR | 发布年份 |
|---|---|---|---|---|
| Google Pixel 10 Pro XL | 414 × 921 | 1344 × 2992 | 3.25 | 2025 |
| Google Pixel 10 Pro | 410 × 914 | 1280 × 2856 | 3.125 | 2025 |
| Google Pixel 10 | 412 × 923 | 1080 × 2424 | 2.625 | 2025 |
| Google Pixel 10 Pro Fold (Cover / Main) | 412 × 923 / 692 × 717 | 1080 × 2424 / 2076 × 2152 | 2.625 / 3.0 | 2025 |
| Samsung Galaxy S25 Ultra | 412 × 891 | 1440 × 3120 | 3.5 | 2025 |
| Samsung Galaxy S25+ | 412 × 891 | 1440 × 3120 | 3.5 | 2025 |
| Samsung Galaxy S25 | 360 × 780 | 1080 × 2340 | 3.0 | 2025 |
| Samsung Galaxy Z Fold6 (Cover / Main) | 323 × 792 / 619 × 720 | 968 × 2376 / 1856 × 2160 | 3.0 | 2024 |
| Samsung Galaxy Z Flip6 | 393 × 960 | 1080 × 2640 | 2.75 | 2024 |
| Samsung Galaxy S24 Ultra | 412 × 891 | 1440 × 3120 | 3.5 | 2024 |
| Samsung Galaxy S24+ | 412 × 891 | 1440 × 3120 | 3.5 | 2024 |
| Samsung Galaxy S24 | 360 × 780 | 1080 × 2340 | 3.0 | 2024 |
| Google Pixel 9 Pro XL | 414 × 921 | 1344 × 2992 | 3.25 | 2024 |
| Google Pixel 9 Pro | 410 × 914 | 1280 × 2856 | 3.125 | 2024 |
| Google Pixel 9 | 412 × 923 | 1080 × 2424 | 2.625 | 2024 |
| Google Pixel 8 Pro | 412 × 921 | 1344 × 2992 | 3.25 | 2023 |
| Google Pixel 8 | 412 × 915 | 1080 × 2400 | 2.625 | 2023 |
| Samsung Galaxy S23 Ultra | 412 × 915 | 1440 × 3088 | 3.5 | 2023 |
| Samsung Galaxy S23+ | 384 × 854 | 1080 × 2340 | 2.8125 | 2023 |
| Samsung Galaxy S23 | 360 × 780 | 1080 × 2340 | 3.0 | 2023 |
| Google Pixel 7 Pro | 412 × 892 | 1440 × 3120 | 3.5 | 2022 |
| Google Pixel 7 | 412 × 915 | 1080 × 2400 | 2.625 | 2022 |
| Samsung Galaxy S22 Ultra | 412 × 915 | 1440 × 3088 | 3.5 | 2022 |
| Samsung Galaxy S22+ | 384 × 854 | 1080 × 2340 | 2.8125 | 2022 |
| Samsung Galaxy S22 | 360 × 780 | 1080 × 2340 | 3.0 | 2022 |
| Google Pixel 6 Pro | 412 × 915 | 1440 × 3120 | 3.5 | 2021 |
| Google Pixel 6 | 412 × 915 | 1080 × 2400 | 2.625 | 2021 |
| Samsung Galaxy S21 Ultra | 384 × 854 | 1440 × 3200 | 3.75 | 2021 |
| Samsung Galaxy S21+ | 384 × 854 | 1080 × 2400 | 2.8125 | 2021 |
| Samsung Galaxy S21 | 360 × 800 | 1080 × 2400 | 3.0 | 2021 |
理解视口尺寸
视口基础知识
- 视口尺寸: 您的网站可以使用的CSS像素可见区域
- 屏幕分辨率: 设备上实际的物理像素数量
- 设备像素比 (DPR): 物理像素与CSS像素之间的比率
- 方向: Android设备支持竖屏和横屏两种模式
设计考虑
- 为各种屏幕尺寸和密度设计
- 考虑不同的长宽比
- 针对触摸交互进行优化
- 使用适当的媒体查询
- 考虑可折叠设备
设备视口常见问题
视口尺寸是页面布局使用的 CSS 像素区域,屏幕分辨率是设备的物理像素数量。二者由 DPR 关联,但浏览器 UI 和系统缩放会改变实际视口。
即使物理分辨率接近,DPR、系统显示缩放和浏览器实现差异也会让 CSS 视口宽度不同。
这张表可作为真实设备参考,但断点应优先依据内容布局变化而不是单一机型。建议重点覆盖 360、390、412、768、820、834、1024 等 CSS 像素宽度。
折叠屏在外屏和内屏下会出现差异很大的视口比例。应分别测试两种状态和横竖屏切换,避免把布局写死在单一宽度。
我们会在主要新品发布或规格更新后同步数据。上线前的关键页面,请务必再用真机或云真机进行验证。
相关资源
加载中...