移动WEB开发之流式布局--移动端基础

浏览器现状
PC端常见浏览器
360浏览器、谷歌浏览器、火狐浏览器、QQ浏览器、百度浏览器、搜狗浏览器、IE浏览器 。
移动端常见浏览器
UC浏览器,QQ浏览器,欧朋浏览器,百度手机浏览器,360安全浏览器,谷歌 浏览器,搜狗手机浏览器,猎豹浏览器,以及其他杂牌浏览器 。
国内的UC和QQ,百度等手机浏览器都是根据修改过来的内核,国内尚无自主研发的内核,就像国内的手 机操作系统都是基于修改开发的一样 。
总结:兼容移动端主流浏览器,处理内核浏览器即可 。
手机屏幕现状
移动端设备屏幕尺寸非常多,碎片化严重 。

移动WEB开发之流式布局--移动端基础

文章插图
设备有多种分辨率:, , ,,等,还有传说中的2K,4k屏 。
近年来的碎片化也加剧了,其设备的主要分辨率有:, , , 等 。
作为开发者无需关注这些分辨率,因为我们常用的尺寸单位是 px。
常见移动端屏幕尺寸
注:以上数据均参考自How to Findfor Any-
注:作为前端开发,不建议大家去 纠结dp,dpi,pt,ppi等单位 。
移动端调试方法
移动WEB开发之流式布局--移动端基础

文章插图
(谷歌浏览器)的模拟手机调试
添加手机
搭建本地web服务器,手机和服务器一个局域网内,通过手机访问服务器
使用外网服务器,直接IP或域名访问
总结
移动端浏览器我们主要对内核进行兼容
我们现在开发的移动端主要针对手机端开发
现在移动端碎片化比较严重,分辨率和屏幕尺寸大小不一
【移动WEB开发之流式布局--移动端基础】学会用谷歌浏览器模拟手机界面以及调试