移动WEB页面开发

一、如今的移动行业:
1.移动互联网的发展
2.智能手机迅速发展
3.移动WEB应用的发展
4.移动端的开发需求逐年增加
二、移动网页开发和pc网页开发的区别:
1.终端设备及浏览器
2.分辨率
3.视口
4.输入特性:
鼠标、键盘
触摸
三、PC端开发浏览器:
Chrome、IE、火狐
四、移动浏览器类型:
内置浏览器、可下载浏览器、代理浏览器、WebView
五、谷歌浏览器测试环境:
1.Emlation:
(1)Device:可以切换设备和型号
(2)Resolution:设备像素
(3)Device pixel ratio:设备像素比
2.NetWork conditions:
(1)Disk cache:磁盘缓冲,默认是不缓冲的
(2)NetWork throttling:网络节流,单击下拉菜单,可以模拟网络测试。
3.Sensors:
(1)Geolocation:模拟地理定位,shanghai,london、莫斯科、东京
lat:经度
lon:纬度
(2)orientation:模拟陀螺仪,这个功能一般用于摇一摇等有重力感应的场景。
α:设备绕Z轴旋转的数值
β:设备绕X轴旋转的数值
γ:设备绕Y轴旋转的数值
六、移动端视口:
1.布局视口:在移动端上,视口与移动浏览器屏幕宽度不在关联,而是完全独立的。(在桌面上浏览器上,浏览器窗口就是约束CSS布局窗口,他决定了用户可以看到什么)
2.视觉视口:在手机上,桌面视口被拆分为两个,布局视口会限制CSS布局,视觉视口会决定用户能看到什么。
3.理想视口:它明确了特定浏览器布局视口的理想尺寸。
七、视口标签:

八、设备像素比:
1.设备像素:是设备屏幕的物理像素,任何设备的物理像素都是固定的。
2.设备像素比:设备像素个数和理想视口的比。
3.DPI:用像素的数量除以屏幕的以英寸为单位的宽度可以得到你的设备每英寸的点数,简称DPI。
九、移动网页开发和PC网页开发的异同:
1.不同点:
(1)适配不同的分辨率和屏幕尺寸
(2)兼容的浏览器
2.相同点:
布局结构
使用的技术
十、使用相对长度单位em来布局网页内容:
1.em的值并不是固定的
2.em会继承父级元素的字体的大小
十一、使用相对长度单位rem来布局网页内容:
1.rem的值并不是固定的
2.rem的值是相对于根节点html而发生变化的(与父节点无关)

原文地址:https://www.cnblogs.com/a1111/p/12815862.html