移动端基础

移动端基础#

浏览器现状#

PC端常见浏览器#

360、谷歌、火狐、QQ、百度、搜狗、IE

移动端常见浏览器#

UC、QQ、opera(欧朋)、百度、360、谷歌、搜狗、猎豹，以及其它杂牌浏览器

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

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

手机屏幕现状#

• 移动端设备屏幕尺寸非常多，碎片化严重
• Android设备有多种分辨率：480*800，480*854，540*960，720*1280，1080*1920等，还有2k，4k屏等。
• 近年来iPhone的碎片化也加剧了，其设备的主要分辨率有：640*960，640*1136，750*1334，1242*2208等。
• 作为开发者无需关注这些分辨率，因为我们常用的尺寸单位是px。

常见移动端屏幕尺寸#

注：以上数据均参考自 https://material.io/devices/

作为前端开发，不建议去纠结 dp,dpi,ppi 等单位。

移动端调试方法#

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