HTML5之viewport使用

好久都没更新博客了，最近一年转型移动端，当然网页端也得兼顾，慢慢写一写基本性的文章，多积累。

本期介绍下viewport的一些使用：

先看看viewport在页面中的样子：

<meta name="viewport" content="initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no">

 

先罗列下移动页面遇到的单位：

px、pt、pc、sp、em、rem、dp、dip、ppi、dpi、ldpi、mdpi、hdpi、xhdpi、xxhdpi……

 

 

手机浏览器是把页面放在一个虚拟的“窗口”（viewport）中，窗口可大于或小于手机的可视区域，一般手机默认viewport大于可视区域。这样不会破坏没有针对手机浏览器优化的网页的布局，用户可以通过平移和缩放来看网页的其他部分。