优化移动设备访问之规定缩放倍数

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

只有一行代码;这行代码就规定了网页初始缩放倍数为 1 倍。如果我们在电脑上调整浏览器的“分辨率”(窗口大小)测试网站好了,那么要在移动设备(如手机)上达到这个效果,必定需要这行代码。否则移动设备浏览器可能首次加载网站网页时,缩小网页。

当然,你也可以进行一些拓展。下面是关于 meta 标签 viewport 属性的更多内容信息:

  • width:viewport 的宽度。可以指定为一个像素值,如:600,或者为特殊的值,如 device-width 为设备的宽度(单位为缩放为 100% 时的 CSS 的像素)。
  • height:viewport 的高度。
  • initial-scale:初始缩放比例,即当浏览器第一次加载页面时的缩放比例。
  • maximum-scale:允许浏览者缩放到的最大比例,一般设为 1.0。
  • minimum-scale:允许浏览者缩放到的最小比例,一般设为 1.0。
  • user-scalable:浏览者是否可以手动缩放,yes(或 true) 或 no(或 false)

大部分手机浏览器都支持这个语句,据说 Opera Mobile 要达到 9.5 才支持。

全部为采集文章,文中的 联系方式 均不是 本人 的!

发表评论