移动端的基本概念与开发

设备独立像素

屏幕的大小、屏幕尺寸（别名叫点，是个单位）
获取：window.screen.width / window.screen.height
 注意：1、横竖屏切换的时候。真机里的这个值不会改变，但在模拟器里是会切换的
2、在一个点里可以放多个像素
3、这个值是可以被改变的（缩放）

设备像素（物理像素）

屏幕分辨率（实际放的像素值），买手机的时候被告知的像素值

这个值是虚拟的，无法获取

像素比（DPR，这个值无法修改）

缩放的比例=设备像素/设备独立像素

获取：window.devicePixelRatio

iphone 6 举例：

375 * 667   设备独立像素，屏幕尺寸

750 * 1334  设备像素，屏幕分辨率

2         像素比

viewport 视口（可视区窗口） ，通过mete 标签设置

未设置

1、屏幕的宽度一般为980，但不同的型号也会不同

2、真机与模拟器的值也会不同

3、用window.innerWidth/window.innerHeight获取

设置了

content 视口里的相关设置

width 屏幕的宽度

device-width 设备的实际宽度，不设置的时候默认为这个值

数值（不加单位） 不建议设置数字（安卓设备有些不支持，一线互联网公司都不设置）

height 屏幕的高度

device-height 设备的实际高度

数值（不加单位） 一般不设置高度

user-scalable 能否缩放

yes 允许缩放

no不允许缩放

initial-scale 初始比例（要与最小缩放比例一致），加上这个后并不是把每个元素都缩放了，而是改变了设备独立像素

mininum-scale 最小能够缩放比例

maxinum-scale 最大能够缩放比例

1、如果用缩放的话，就把width与user-scalable去掉

2、用了缩放后，并不是真正的缩放了，而是改变了屏幕的尺寸（设备的独立像素）