语法:
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" >
标准的viewport设置
设备宽度和设备保持一致 width=device-width 宽度为设备宽度
视口的默认缩放比例1.0 initial-scale=1.0 初始缩放比
不允许用户自行缩放 user-scalable=no" 用户是否可以缩放 Yes或no
最大允许缩放的比例为1.0 maximum-scale=1.0 最大缩放比
最小允许缩放的比例为1.0 minimum-scale=1. 0 最小缩放比
1开放像素=2物理像素(iphone8)
多倍图
2倍图
例:准备的图片放到手机屏幕上会进行缩放 50*50 放大后100*100
先写入100*100的图,限制宽高50*50,再放进手机屏幕,就不会模糊了
精灵图
在firework里面把精灵图等比例缩放为原来的一半
之后根据大小 测量坐标
注意代码 background-size也要写 精灵图原来宽度的一半
移动端CSS初始化 normalize.css