视口（viewport）学习

viewport 是用户网页的可视区域。即设备的屏幕上能用来显示我们的网页的那一块区域。

<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">

content里面的属性必须知道

width:控制viewport的大小，可以是指定的值，或者特殊值，如device-width表示设备指定宽度。

height:和width相对应，表示高度。

initial-scale ：初始化缩放比例，也是当前页面第一次load的时候缩放的比例

maximum-scale：允许用户缩放的最大比例.

minimum-scale：允许用户缩放的最小比例。

user-scalable：用户是否可以手动缩放
设备像素和CSS像素
设备像素（device pixels）是任何设备的正式分辨率，并且(通常)可以通过screen.width/height知道。
给某个元素宽度width:128px，如果显示屏宽1024px，最大化浏览器屏幕，则该元素将在显示器上填充显示八次。
然而，如果用户缩放，则该计算将会改变。比如用户缩放为200%，则宽度为128px的元素将在1024px宽显示器上显示的四次。

屏幕尺寸（Screen size）

Window size