最近因为要把网站迁移到移动平台,花时间学习了一下ViewPort 这个特殊的meta tag
以下笔记基于这几篇好文
- http://www.quirksmode.org/mobile/viewports.html
- http://davidbcalhoun.com/2010/viewport-metata
- http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/
学习心得:
- 所谓device pixels就是屏幕的分辨率,是不变的。而 CSS pixel是随着缩放变大变小的。
- Viewport的用处是告诉浏览器,设备的宽度。如果不加这个meta,那么浏览器默认会用980px来显示。这样的话,在pad或者手机上会显得文字都缩小。
- Viewport还可以限制缩放比例。
- 并非标准协议,但大多移动浏览器包括apple,android以及windowsphone都支持。