用于媒体查询的最常见手机和平板电脑尺寸？ （包括基于 10 万用户的答案）

Question

我正在进行响应式设计，并希望确保 CSS 媒体查询针对最常见的设备尺寸进行了优化。 （当然，同时适用于所有尺寸。）

那么，当今最常用的尺寸是什么？

（实际上我已经根据自己的数据得到了答案，但认为其他人也可能喜欢看到它。）

Answer 1

这些数据基于 2024 年 5 月超过 100,000 名不同用户。大多数用户是美国的成年人。这些号码仅适用于移动设备。

宽度是使用 Javascript 测量的，并在页面加载时发送回服务器。宽度是根据用户的视角来测量的：如果以横向模式查看普通 iPad，则宽度为 1024；如果以横向模式查看普通 iPad，则宽度为 1024；纵向模式下为 768。

每个唯一的用户、宽度、设备类型组合都算作“点击”。例如，单个用户可能会被计为 iPad 1024、iPad 768 和 Android 360 的点击。

18,000 名用户仅使用平板电脑。 69,000 人只使用手机。 24,000 人同时使用了两者。

片剂

宽度	设备	百分比（平板电脑用户）
1024	iPad	50.1
768	iPad	30.3
800	安卓	3
1280	安卓	1.7
1080	iPad	1.2
602	安卓	1
1180	iPad	0.8
810	iPad	0.8
1366	iPad	0.7
1334	安卓	0.6
1194	iPad	0.5
820	iPad	0.4
753	安卓	0.4
834	iPad	0.4
962	安卓	0.4
691	安卓	0.4
686	安卓	0.4
1112	iPad	0.4
712	安卓	0.3
1205	安卓	0.3
600	安卓	0.3
768	安卓	0.3
1138	安卓	0.3
674	安卓	0.2
1024	安卓	0.2
320	iPad	0.2
1318	安卓	0.2
375	iPad	0.2
825	安卓	0.2
1098	安卓	0.1
760	iPad	0.1
1920	安卓	0.1
823	安卓	0.1
902	安卓	0.1
960	安卓	0.1
1007	安卓	0.1
744	iPad	0.1
1046	iPad	0.1
1143	安卓	0.1
1133	iPad	0.1
1317	安卓	0.1
640	安卓	0.1
860	iPad	0.1
704	iPad	0.1
1366	安卓	0.1
610	安卓	0.1
854	安卓	0.1
829	安卓	0.1
1078	安卓	0.1
642	安卓	0.1

片剂

宽度	设备	百分比（电话用户）
375	iPhone	56.9
412	安卓	9.9
360	安卓	8.8
384	安卓	5.1
320	iPhone	3.2
390	iPhone	1.8
724	iPhone	1.5
414	iPhone	1.4
320	安卓	1.3
393	iPhone	0.9
393	安卓	0.8
430	iPhone	0.7
339	安卓	0.7
432	安卓	0.6
428	iPhone	0.6
376	安卓	0.4
448	安卓	0.3
730	iPhone	0.3
710	iPhone	0.2
667	iPhone	0.2
568	iPhone	0.2
486	安卓	0.2
345	安卓	0.2
388	安卓	0.2
1080	安卓	0.2
346	安卓	0.1
352	安卓	0.1
377	安卓	0.1
712	iPhone	0.1
534	安卓	0.1
705	安卓	0.1
396	安卓	0.1
1082	安卓	0.1
485	安卓	0.1
749	安卓	0.1
424	安卓	0.1
806	安卓	0.1
699	安卓	0.1
732	iPhone	0.1