viewport(視口)就是設(shè)備上用來顯示網(wǎng)頁的那一塊區(qū)域，但是viewport一般不局限于可視區(qū)域的大小，更多情況下都要比可視區(qū)域要大。移動設(shè)備上一般都為980px,除了windows系統(tǒng)手機(jī)為1024px。
移動設(shè)備上視口分為視覺視口(即屏幕大小，決定用戶看到什么)、布局視口(980px)，然后移動設(shè)備或按照一定比例縮放成視覺視口，用來約束CSS布局。
理想視口，我們可以把布局視口設(shè)為視覺視口，從而來影響css布局，只需要下面一行代碼來實(shí)現(xiàn)：

<meta name="viewport" content="width=device-width"/>

這行代碼告訴瀏覽器布局視口的寬度要和設(shè)備視口的寬度一樣。
我們也可以設(shè)置多個屬性:

<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=yes,maximum-scale=2"/>

其中，
width=device-width 設(shè)置布局視口的寬度為屏幕寬度
initial-scale=[number] 設(shè)置初始的縮放比率
user-scalable=yes | no 是否允許頁面縮放，默認(rèn)為yes
maximum-scale=[number] 允許最大放大比率
minimun-scale=[number] *允許最小縮小比率，當(dāng)設(shè)定為1 等同于 user-scalable = no *

最后再提一個知識點(diǎn)，就是em 和rem:
em 相對于其父級元素去計算，而rem 相對于html節(jié)點(diǎn)字體大小。