移动端基础第一天

***移动端基础第一天***

1.移动端浏览器主要对webkit内核进行兼容
2.我们现在开发的移动端主要针对手机端开发
3.现状移动端碎片化比较严重，分辨率和屏幕尺寸带下不一
4.学会用谷歌浏览器模拟手机界面以及调试

布局视口 layout viewport

1.一般移动设备的浏览器默认设置了一个布局视口，用于解决早期PC端页面在手机上显示的问题
2.缺点：在PC端上的网页大多都可以在手机呈现，不过缺点就是元素看上去很小，一般默认可以通过手动缩放网页

视觉视口visual viewport

1.它是用户正在看到的网站的区域
2.可以通过缩放去操作视觉视口，但不会影响布局视口，布局视口保持原来的宽度

理想视口 ideal viewport

1.为了使用网站在移动端有理想的浏览和阅读的设定
2.理想视口对设备来说，是最理想的视口尺寸
3.需要手动填写meta视口标签通知浏览器操作
4.meta视口标签的主要米的，布局视口的宽度应该与理想视口的宽度一致，简单理解就是设备有多宽，我们布局的视口就多宽。

meta视口标签

meta name="viewport" content="(宽度=设备的-宽度)width=device-width,(用户是否缩放：yes/no)user=scalable=no, (初始化缩放比例)initial-scale=1.0,(最大缩放比例)maximum-scale=1.3,(最小缩放比例)minimum-scale=1.0"

二倍图

1.物理像素点指的是屏幕显示的最小颗粒，是物理真实存在的。
2.开发的时候1PX不是一定等于1个物理