在开发前端,移动APP,以及设计UI的时候,我们经常会去搜索不同设备之间的尺寸,来开始自己的工作,以保证显示效果达到更好,这里收集了现在常用的设备.
设备更新速度快,有些没罗列的,大家可以谷歌或者百度一下.
常见智能手机
name
phys.
width
phys.
height
CSS
width
CSS
height
pixel
ratio
phys. ppi
CSS ppi
AppleiPhone 6 |
750 |
1334 |
375 |
667 |
2 |
326 |
192 |
AppleiPhone 5 |
640 |
1136 |
320 |
568 |
2 |
326 |
192 |
AppleiPhone 4 |
640 |
960 |
320 |
480 |
2 |
326 |
192 |
AppleiPhone 3 |
320 |
480 |
320 |
480 |
1 |
163 |
96 |
AppleiPod Touch |
640 |
1136 |
320 |
568 |
2 |
326 |
192 |
LGG4 |
1440 |
2560 |
360 |
640 |
4 |
538 |
384 |
LGG3 |
1440 |
2560 |
360 |
640 |
4 |
538 |
384 |
LGOptimus G |
768 |
1280 |
384 |
640 |
2 |
318 |
192 |
SamsungGalaxy Note 2 |
720 |
1280 |
360 |
640 |
2 |
267 |
192 |
SamsungGalaxy Note |
800 |
1280 |
400 |
640 |
2 |
285 |
192 |
SamsungGalaxy S5 |
1080 |
1920 |
360 |
640 |
3 |
441 |
288 |
SamsungGalaxy S4 |
1080 |
1920 |
360 |
640 |
3 |
441 |
288 |
SamsungGalaxy S4 mini |
540 |
960 |
360 |
640 |
1.5 |
256 |
144 |
SamsungGalaxy S3 |
720 |
1280 |
360 |
640 |
2 |
306 |
192 |
SamsungGalaxy S3 mini |
480 |
800 |
320 |
533 |
1.5 |
233 |
144 |
SamsungGalaxy S2 |
480 |
800 |
320 |
533 |
1.5 |
217 |
144 |
SamsungGalaxy S |
480 |
800 |
320 |
533 |
1.5 |
233 |
144 |
SamsungGalaxy Nexus |
720 |
1200 |
360 |
600 |
2 |
316 |
192 |
LGNexus 5 |
1080 |
1920 |
360 |
640 |
3 |
445 |
288 |
LGNexus 4 |
768 |
1280 |
384 |
640 |
2 |
320 |
192 |
MicrosoftLumia 1020 |
768 |
1280 |
320 |
480 |
2.4 |
332 |
220 |
MicrosoftLumia 925 |
768 |
1280 |
320 |
480 |
2.4 |
332 |
220 |
MicrosoftLumia 920 |
768 |
1280 |
320 |
480 |
2.4 |
332 |
220 |
MicrosoftLumia 900 |
480 |
800 |
320 |
480 |
1.5 |
217 |
144 |
MicrosoftLumia 830 |
720 |
1280 |
320 |
480 |
2 |
294 |
192 |
MicrosoftLumia 620 |
480 |
800 |
320 |
480 |
1.5 |
252 |
144 |
HTCOne |
1080 |
1920 |
360 |
640 |
3 |
468 |
288 |
HTC8X |
720 |
1280 |
320 |
480 |
3 |
341 |
288 |
HTCEvo 3D |
540 |
960 |
360 |
640 |
1.5 |
256 |
144 |
SonyXperia Z3 |
1080 |
1920 |
360 |
598 |
3 |
424 |
288 |
SonyXperia Z |
1080 |
1920 |
360 |
640 |
3 |
443 |
288 |
SonyXperia S |
720 |
1280 |
360 |
640 |
2 |
342 |
192 |
SonyXperia P |
540 |
960 |
360 |
640 |
1.5 |
275 |
144 |
XiaomiMi 4 |
1080 |
1920 |
360 |
640 |
3 |
441 |
288 |
XiaomiMi 3 |
1080 |
1920 |
360 |
640 |
3 |
441 |
288 |
LenovoK900 |
1080 |
1920 |
360 |
640 |
3 |
401 |
288 |
PantechVega n°6 |
1080 |
1920 |
360 |
640 |
3 |
373 |
288 |
BlackberryLeap |
720 |
1280 |
390 |
695 |
2 |
294 |
177 |
BlackberryPassport |
1440 |
1440 |
504 |
504 |
3 |
453 |
274 |
BlackberryClassic |
720 |
720 |
390 |
390 |
1.8 |
294 |
177 |
BlackberryQ10 |
720 |
720 |
346 |
346 |
2 |
328 |
192 |
BlackberryZ30 |
720 |
1280 |
360 |
640 |
2 |
295 |
192 |
BlackberryZ10 |
768 |
1280 |
384 |
640 |
2 |
355 |
192 |
BlackberryTorch 9800 |
360 |
480 |
360 |
480 |
1 |
187 |
96 |
ZTEGrand S |
1080 |
1920 |
360 |
640 |
3 |
441 |
288 |
ZTEOpen (Firefox OS) |
480 |
720 |
320 |
480 |
1.5 |
165 |
144 |
常见平板手机
name
phys.
width
phys.
height
CSS
width
CSS
height
pixel
ratio
phys. ppi
CSS ppi
AppleiPhone 6 Plus |
1080 |
1920 |
414 |
736 |
3 |
401 |
249 |
MotorolaNexus 6 |
1440 |
2560 |
412 |
690 |
3.5 |
493 |
336 |
MicrosoftLumia 1520 |
1080 |
1920 |
432 |
768 |
2.5 |
367 |
240 |
SamsungGalaxy Note 4 |
1440 |
2560 |
360 |
640 |
4 |
515 |
384 |
SamsungGalaxy Note 3 |
1080 |
1920 |
360 |
640 |
3 |
386 |
288 |
常见平板电脑
name
phys.
width
phys.
height
CSS
width
CSS
height
pixel
ratio
phys. ppi
CSS ppi
AppleiPad Pro |
2048 |
2732 |
1024 |
1366 |
2 |
265 |
192 |
AppleiPad 3, 4, Air |
1536 |
2048 |
768 |
1024 |
2 |
264 |
192 |
AppleiPad 1, 2 |
768 |
1024 |
768 |
1024 |
1 |
132 |
96 |
AppleiPad mini 2, 3 |
1536 |
2048 |
768 |
1024 |
2 |
326 |
192 |
AppleiPad mini |
768 |
1024 |
768 |
1024 |
1 |
163 |
96 |
SamsungGalaxy Tab 3 10" |
800 |
1280 |
800 |
1280 |
1 |
149 |
96 |
SamsungGalaxy Tab 2 10" |
800 |
1280 |
800 |
1280 |
1 |
149 |
96 |
SamsungGalaxy Tab (8.9") |
800 |
1280 |
800 |
1280 |
1 |
170 |
96 |
SamsungGalaxy Tab 2 (7") |
600 |
1024 |
600 |
1024 |
1 |
170 |
96 |
SamsungNexus 10 |
1600 |
2560 |
800 |
1280 |
2 |
300 |
192 |
HTCNexus 9 |
1538 |
2048 |
768 |
1024 |
2 |
281 |
192 |
AsusNexus 7 (v2) |
1080 |
1920 |
600 |
960 |
2 |
323 |
192 |
AsusNexus 7 (v1) |
800 |
1280 |
604 |
966 |
1.325 |
216 |
127 |
LGG Pad 8.3 |
1200 |
1920 |
600 |
960 |
2 |
273 |
192 |
AmazonKindle Fire HD 8.9 |
1200 |
1920 |
800 |
1280 |
1.5 |
254 |
144 |
AmazonKindle Fire HD 7 |
800 |
1280 |
480 |
800 |
1.5 |
216 |
144 |
AmazonKindle Fire |
600 |
1024 |
600 |
1024 |
1 |
167 |
96 |
MicrosoftSurface Pro 3 |
1440 |
2160 |
1024 |
1440 |
1.5 / 1.4 |
216 |
144 |
MicrosoftSurface Pro 2 |
1080 |
1920 |
720 |
1280 |
1.5 |
207 |
144 |
MicrosoftSurface Pro |
1080 |
1920 |
720 |
1280 |
1.5 |
207 |
144 |
MicrosoftSurface |
768 |
1366 |
768 |
1366 |
1 |
148 |
96 |
BlackberryPlaybook |
600 |
1024 |
600 |
1024 |
1 |
169 |
96 |
另外的设备
name
phys.
width
phys.
height
CSS
width
CSS
height
pixel
ratio
phys. ppi
CSS ppi
GoogleGlass |
640 |
360 |
427 |
240 |
1.5 |
? |
144 |
本文属于吴统威的博客,微信公众号:bianchengderen的原创文章,转载时请注明出处及相应链接:http://www.wutongwei.com/front/infor_showone.tweb?id=142 ,欢迎大家传播与分享.
分享到:
相关推荐
Amaze UI的目标帮助开发者提高开发效率,提升网页效果,即用最短的时间做出最赞的网页,使更多的前端开发者不再受前端复杂代码困扰。下面是特性硬广Amaze UI 是中国首个开源 HTML5 跨屏前端框架,基于 React.js 开发...
Cola UI遵循Mobile First的策略,特别适合于移动设备应用开发。 Cola UI整合了jQuery和Semantic UI,同时提供更多常用的List、Table、Tree等高级控件。 相关链接 产品官网 客户端API 快速入门 QQ交流群: 群名称:...
型的即时编译型的编程语言在移动应用开发中得到了开发者的青睐, 其在微信 小程序开发和uni-App开发中得到了较多使用。 不同与小程序, HarmonyOS JS 框架拥有独特的代码优化模式, JS代码可以在HarmonyOS系统中快速...
移动开发的未来-来自一个移动开发者的自白 移动Web的现在与未来 移动分析助力App精细化运营 一站式短视频技术架构的新解读 移动电商中的图像算法应用 出行IOS端瘦身实践 Instagram Direct:高效可靠的数据端到端传输...
Agile移动应用前端框架既解决了前端UI层的显示,达到高性能的UI展示效果,也提供了一整套完善的页面切换和交互效果,并融入了数据注入的理念,使界面和数据分离,代码维护难度降低,重用性高。整体运行效率接近于...
AKjs前端框架是Andrew.Kim和他的团队一起研发的基于jQuery的一个轻量级前端框架。它是只要懂jQuery的语法很容易上手的框架。该框架里面现在发布了很多移动端常用的功能效果;开发者们
2011年也是移动互联网高速发展的一年,随着iPhone、Android等智能设备的迅速普及,以及Web技术跨平台等优点更广泛的为人所知,移动Web技术逐渐成为大家关注的新热点之一。国内移动Web技术中文资源相对缺乏,社区尚待...
整套组件称为Telerik DevCraft, HTML组件称为Kendo UI, Telerik平台是所有移动设备的通用术语。 这个伟大的工具提供了一个完整的体验,并为您带来了您需要为现代应用程序提供响应性UI的功能。 它允许您通过集成组件...
前端基于AmazeUI v2.7.2 组件丰富,模块化 以移动优先(Mobile first)为理念,从小屏逐步扩展到大屏,最终实现所有屏幕适配,适应移动互联潮流。 本地化支持 相比国外框架,Amaze UI 关注中文排版,根据用户代理...
包含前端、后端、移动开发、操作系统、人工智能、物联网、信息化管理、数据库、硬件开发、大数据、课程资源、音视频、网站开发等各种技术项目的源码。 包括STM32、ESP8266、PHP、QT、Linux、iOS、C++、Java、python...
适用人群: 本资源适用于Web开发者、移动应用程序开发者以及希望学习UniApp框架的初学者。如果你有一些前端开发经验,那么这个资源将帮助你更快地上手UniApp。 能学到什么: 学习这些源码案例将让你了解如何使用...
Bootstrap:作为前端UI框架,构建响应式的页面布局。 Git:作为代码管理工具,方便团队协作开发。 通过以上技术和功能的结合,本项目为用户提供了一个便捷、高效的移动网赚平台,帮助用户实现在线赚钱的目标。同时...
Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的用户界面。本课程通过一个企业站APP的实例让大家能够快速的编写一个完整的APP项目。 功能模块: 启动页面 首页 Banner轮播 最新产品 产品列表 产品...
Angular 是一款十分流行且好用的 Web 前端框架,目前由 Google 维护。这个条目收录的是 Angular 2 及其后面的版本。由于官方已将 Angular 2 和之前的版本 Angular.js 分开维护(两者的 GitHub 地址和项目主页皆不...
该资源包通常包含了一系列的文件和文件夹,涉及网站前端设计、后端开发、数据库管理以及可能的移动应用开发等多个方面。在内容上,这个压缩包可能会包含如下几个主要部分:用户界面设计(UI): 使用HTML, CSS, ...
媒体查询 CSS媒体查询允许开发者基于浏览网站的设备的特性来应用不同的样式申明,最常用的特性是视口宽度。 GCF 谷歌内嵌浏览器框架, 使用此插件,用户可以通过Internet Explorer的用户界面,以Chrome内核的渲染方式...
Thresh提供了一个简单、高效的应用开发框架和丰富的组件及API,帮助开发者在前端开发中具有原生 APP 体验的服务,是满帮集团开源的一套稳定、高性能的跨端动态化方案。 一、Thresh特性与整体架构 Thresh项目推出...
Material-UI和CSS媒体查询,用于响应式布局 特征 用户登录 使用Google Places API注册餐厅 JWT刷新令牌流 添加/编辑/删除记忆项目 在菜单项上添加可选和必需的选项 上传菜单项和餐厅徽标图像 编辑营业时间 未来的...
Thresh提供了一个简单,高效的应用开发框架和丰富的组件以及API,帮助开发者在前端开发中具有原生APP体验的服务,是满帮集团开源的一套稳定,高效的跨端动态化方案。 体验包下载地址 一,主要核心亮点 1,适用于前端...