常见手机的设备分辨率和viewport分辨率,及其1rem的大小（以vmin为单位）

常见的devicePixelRatio是1, 1.325, 1.5, 2, 2.4, 3.  (具体见下面的表格，从Chrome Emulator中导出的）。

Brand Device Resolution Pixel Ratio
Amazon Kindle Fire 1024x600 1
Amazon Kindle Fire HD 7" 1280x800 1.5
Amazon Kindle Fire HD 8.9" 1920x1200 1.5
Apple iPad 1 1024x768 1
Apple iPad 2 1024x768 1
Apple iPad 3 2048x1536 2
Apple iPad 4 2048x1536 2
Apple iPad Mini 1024x768 1
Apple iPhone 3GS 320x480 1
Apple iPhone 4 640x960 2
Apple iPhone 5 640x1136 2
BlackBerry PlayBook 1024x600 1
BlackBerry Z10 768x1280 2
BlackBerry Z30 720x1280 2
Google Nexus 10 2560x1600 2
Google Nexus 4 768x1280 2
Google Nexus 5 1080x1920 3
Google Nexus 7 1280x800 1.325
Google Nexus 7 (2013) 1920x1200 2
Google Nexus S 480x800 1.5
HTC Desire 480x800 1.5
HTC Desire HD 480x800 1.5
HTC Evo 480x800 1.5
HTC Evo 3D 540x960 1.5
HTC EVO LTE 720x1280 2
HTC One X 720x1280 2
HTC Sensation 540x960 1.5
HTC Touch HD 480x800 1.5
LG Optimus 2X 480x800 1.5
LG Optimus 3D 480x800 1.5
LG Optimus 4X HD 720x1280 1.7
LG Optimus Black 480x800 1.5
LG Optimus G 768x1280 2
LG Optimus LTE 720x1280 1.7
LG Optimus One 320x480 1.5
Motorola Atrix 2 540x960 1
Motorola Atrix 4G 540x960 1
Motorola Defy 480x854 1.5
Motorola Droid 480x854 1.5
Motorola Droid 3 540x960 1
Motorola Droid 4 540x960 1
Motorola Droid Razr 540x960 1
Motorola Droid Razr HD 720x1280 1
Motorola Droid X 480x854 1.5
Motorola Milestone 480x854 1.5
Motorola Xoom 1280x800 1
Motorola Xyboard 1280x800 1
Nokia C5 360x640 1
Nokia C6 360x640 1
Nokia C7 360x640 1
Nokia Lumia 7X0 480x800 1.5
Nokia Lumia 8XX 480x800 1.5
Nokia Lumia 900 480x800 1.5
Nokia Lumia 920 768x1280 2.4
Nokia Lumia 925 768x1280 2.4
Nokia Lumia 928 768x1280 2.4
Nokia Lumia 1020 768x1280 2.4
Nokia N8 360x640 1
Nokia N800 480x800 1.5
Nokia N810 480x800 1.5
Nokia N900 480x800 1.5
Nokia N97 360x640 1
Nokia X7 360x640 1
Samsung Galaxy Nexus 720x1280 2
Samsung Galaxy Note 800x1280 2
Samsung Galaxy Note 2 720x1280 2
Samsung Galaxy Note 3 1080x1920 2
Samsung Galaxy S 480x800 1.5
Samsung Galaxy S 2 480x800 1.5
Samsung Galaxy S 3 720x1280 2
Samsung Galaxy S 4 1080x1920 3
Samsung Galaxy Tab 1024x600 1
Samsung Galaxy Tab 10.1 1280x800 1
Samsung Galaxy Tab 7.7 1280x800 1
Samsung Galaxy Tab 8.9 1280x800 1
Samsung Galaxy W 480x800 1.5
Sony Xperia Ion 720x1280 2
Sony Xperia S 720x1280 2
Sony Xperia Sola 480x854 1
Sony Xperia U 480x854 1
Sony Xperia Z 1080x1920 3
Sony Xperia Z1 1080x1920 3

Common display resolutions[edit]

Standard

Aspect ratio

Width (px)

Height (px)

% of Steam users (Aug 2017)

 % of web users (May 2017)

SVGA

4:3

800

600

n/a

0.35

WSVGA

~17:10

1024

600

n/a

0.44

XGA

4:3

1024

768

1.06

5.34

XGA+

4:3

1152

864

n/a

0.37

WXGA

16:9

1280

720

0.52

2.69

WXGA

5:3

1280

768

0.24

0.54

WXGA

16:10

1280

800

1.13

5.52

SXGA

5:4

1280

1024

2.90

5.14

HD

~16:9

1360

768

2.36

2.25

HD

~16:9

1366

768

17.85

29.94

WXGA+

16:10

1440

900

4.15

6.7

other

16:9

1536

864

0.66

3.5

HD+

16:9

1600

900

4.76

5.89

WSXGA+

16:10

1680

1050

3.11

2.71

FHD

16:9

1920

1080

54.28

16.02

WUXGA

16:10

1920

1200

1.02

1.23

other

21:9

2560

1080

0.69

n/a

WQHD

16:9

2560

1440

2.66

1.67

other

21:9

3440

1440

0.28

n/a

4K UHD

16:9

3840

2160

0.90

n/a

Other

      

1.44

8.1

* https://www.netmarketshare.com/report.aspx?qprid=17  （市场份额统计资料）

https://material.io/devices/

https://hwstats.unity3d.com/mobile/display-winrt.html
http://mediag.com/news/popular-screen-resolutions-designing-for-all/
https://bobmckay.com/web/tablet-smartphone-resolutions-screen-sizes/

http://www.cnblogs.com/GameEngine/p/6528721.html

iPhone viewport设置：

https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

https://en.wikipedia.org/wiki/Display_resolution

常见手机的设备分辨率、viewport和devicePixelRatio的更多相关文章

  1. iOS系统下 的手机屏幕尺寸 分辨率 及系统版本 总结

    今天  我对iOS系统下 的手机屏幕尺寸 分辨率 及系统版本做了一次系统总结 供大家参考. 首先 是系统:    随着iOS 系统不断升级,现在已经到iOS7.0了, 并且TA有了很多新变化,最震撼的 ...

  2. 9个最新的手机/移动设备jQuery插件

    随着互联网的流行,移动网站开始急速增加,在2014年手机网站将会出现很多,所以手机网站是必须要学会制作的.手机网站不像桌面平台一样制作,否则会影响显示效果,目前大部分手机网站使用响应式设计技术,而且也 ...

  3. 最新的手机/移动设备jQuery插件

    随着互联网的流行,移动网站开始急速增加,在2014年手机网站将会出现很多,所以手机网站是必须要学会制作的.手机网站不像桌面平台一样制作,否则会影响显示效果,目前大部分手机网站使用响应式设计技术,而且也 ...

  4. iOS设备分辨率

    CHENYILONG Blog iOS设备分辨率 © chenyilong. Powered by Postach.io Blog

  5. unity获取设备分辨率

    设备分辨率 using UnityEngine; using System.Collections; public class ExampleClass : MonoBehaviour { void ...

  6. is_mobile()判断手机移动设备

    is_mobile()判断手机移动设备.md is_mobile()判断手机移动设备 制作响应式主题时会根据不同的设备推送不同的内容,是基于移动设备网络带宽压力,避免全局接收pc端内容. functi ...

  7. Js获取移动设备分辨率

    在<head>中引入  <meta name="viewport" content="width=device-width, initial-scale ...

  8. Web移动端设计——移动设备分辨率一览表

    作为在移动端开发的web程序员来说,如果不懂设备的一些性能,在开发上面是非常耗时间的一件事,同时带来负面影响的是项目的进度被拖腿了. 下面是个人收集的一些移动端设备的分辨率参数: 1.  平板设备: ...

  9. 移动设备优先viewport

    Bootstrap 3 的设计目标是移动设备优先,然后才是桌面设备.这实际上是一个非常及时的转变,因为现在越来越多的用户使用移动设备. 为了让 Bootstrap 开发的网站对移动设备友好,确保适当的 ...

随机推荐

  1. newinstance()和new有什么区别?

    在初始化一个类,生成一个实例的时候:newInstance() 和 new 有什么区别?用newInstance与用new是区别的,区别在于创建对象的方式不一样,前者是使用类加载机制,那么为什么会有两 ...

  2. Image Widget 的几种加入形式

    image .asset : 加载资源图片,会使打包时包体过大 image.network :网络资源图片,经常换的或者动态的图片 image file : 本地图片,比如相册 重用属性:  fit ...

  3. UVa10129（还没ac）各种re，o(╥﹏╥)o

    这是一道欧拉回路题 欧拉回路:就是一个路径包括每条边恰好一次. 判断是否满足欧拉回路.首先是图是联通的.其次图中每个点的入度等于出度.如果是欧拉路径的话,满足奇点只能等于2或0,并且对于有向图,奇点的 ...

  4. cocos creator 中的粒子效果

    途中的粒子效果,通过plist文件和png两个文件,创建一个粒子节点,将plist文件拖入到粒子节点的file属性中,然后给custom属性打钩,把png文件拖入到texture属性中即可.

  5. GitHub Desktop下载及使用

    GitHub Desktop下载及使用   用了几次 GitHub Desktop 之后,发现不好用,其图形化界面功能有限.推荐使用Git for Windows,官方网站 https://git-f ...

  6. SQL学习 存储过程&DUAL表

    CREATE OR REPLACE PROCEDURE 存储过程 转自 https://www.cnblogs.com/lideng/p/3427822.html oracle中dual表的用途介绍 ...

  7. tornado--初识tornado

    tornado的第一个程序 import tornado.ioloop import tornado.web class Index(tornado.web.RequestHandler): def ...

  8. javaee设计模型简介

    (一)五种模式 1.单例模式 在某些情况下,有些对象只需要一个就可以了,即每个类只需要一个实例.例如,一台计算机上的可以连接多台打印机,但是该计算机上的打印程序只能有一个,这里就可以通过单例模式来避免 ...

  9. Java中HBase的集中過濾器

    比較過濾器:    rowKey过滤器 RowFilter    列族过滤器 FamilyFilter    列过滤器               QualifierFilter    列值过滤器   ...

  10. less的安装和使用

    资料: https://www.cnblogs.com/starof/p/5226739.html