HTML - 15 移动设备网页设计

本教程原出处：网道
本教程文档在原作基础上进行了一定的补充、修改和完善，以满足个人学习、工作中的需要，亦可作为个人口袋书使用。
本教程文档中的原文部分，其版权仍归原作者所有。
本教程文档仅作个人学习、教学和工作使用，任何他人、或机构、组织不得恶意传播、复制本文档，或将本教程文档用做商用

移动设备网页设计

• <meta>的 viewport 设置

• <meta>的 viewport 设置用来控制网页的视觉大小。

<meta name="viewport" content="initial-scale=1">

• 这表示网页初始加载不进行放大或缩小。
• 下面代码指定网页适配的视口宽度。

<meta name="viewport" content="width=320">

• 下面代码指定网页宽度为设备宽度。

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

• 下面代码指定用户不能放大网页。

<meta name="viewport" content="maximum-scale=1">

• 适用手机的网页，一般要写成下面这样。

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

• 注：上述多个属性值，也可以写到一个声明中，多个 content 值可以使用英文逗号分隔。