移动端基础

@

目录

• 1. 浏览器现状
• 2. 手机屏幕的现状
• 3. 常见移动端屏幕尺寸
• 4. 移动端调试方法

---

1. 浏览器现状

PC端常见浏览器：360浏览器、谷歌浏览器、火狐浏览器、QQ浏览器、百度浏览器、搜狗浏览器、IE浏览器等

移动端常见浏览器：UC浏览器，QQ浏览器，欧朋浏览器，百度手机浏览器，360安全浏览器，谷歌浏览器，搜狗手机浏览器，猎豹浏览器，以及其他杂牌浏览器等

国内的UC和QQ，百度等手机浏览器都是根据Webkit修改过来的内核，国内尚无自主研发的内核，就像国内的手机操作系统都是基于Android修改开发的一样。

总结：兼容移动端主流浏览器，处理Webkit内核浏览器即可。

2. 手机屏幕的现状

• 移动端设备屏幕尺寸非常多，碎片化严重。
• Android设备有多种分辨率：480x800, 480x854, 540x960, 720x1280，1080x1920，2K，4k屏等。
• 近年来iPhone的碎片化也加剧了，其设备的主要分辨率有：640x960, 640x1136, 750x1334, 1242x2208等。
• 作为开发者无需关注这些分辨率，因为我们常用的尺寸单位是 px 。

3. 常见移动端屏幕尺寸

设备	尺寸(英寸)	开发尺寸(px)	物理像素比(dpr)
iphone3G	3.5	320*480	1.0
iphone4/4s	3.5	320*480	2.0
iphone5/5s/5c	4.0	320*568	2.0
HTC One M8	4.5	320*640	3.0
iphone6	4.7	375*667	2.0
Nexus 4	4.7	384*640	2.0
Nexus 5x	5.2	411*731	2.6
iphone6 plus	5.5	414*736	3.0
Samsung Galaxy Note 4	5.7	480*853	3.0
Sony Xperia Z Ultra	6.4	540*960	2.0
Nexus 7('12)	7.0	600*960	1.3
ipad Mini	7.9	768*1024	1.0

https://material.io/devices/

4. 移动端调试方法

• Chrome DevTools（谷歌浏览器）的模拟手机调试
• 搭建本地web服务器，手机和服务器一个局域网内，通过手机访问服务器
• 使用外网服务器，直接IP或域名访问

标签：移动,浏览器,基础,320,尺寸,屏幕,2.0
来源： https://www.cnblogs.com/gh-StudyNotes/p/15747317.html