移动端响应式布局

 

1.快捷键：meta:vp+tab键

代码：<meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

2.viewport视口

width=device - width 设置视口的宽度等于设备的宽度，如果不设置的话，默认视口宽度为980px。通俗的理解：我们这个操作其实就是告诉当前的浏览器按照多少宽度来渲染页面，换句话说，就是展示当前这个页面的区域一共有多宽（浏览器的宽度）

user-scalable=no 禁止用户手动缩放

initial-scale=1.0 设置屏幕默认的缩放比例

maximum-scale=1.0 设置屏幕最大的缩放比例

minimum-scale=2.0 设置屏幕最小的缩放比例