最近在做手机app页面的制作。看着蛮简单的页面，没想到需要注意的细节也是蛮多的。首先要考虑的问题就是，手机屏幕不一样，页面显示可能有偏差。那怎么才能做到每个手机宽度是自适应的呢？除了需要考虑最大宽度和最小宽度，就要加标签了。
代码如下：
加上以上三行代码，手机页面的宽度就可以自适应了。那接下来就分别解释每一句的具体含义吧。
1.
name=”viewport” –这就是针对移动端浏览器。
width=device-width–告诉浏览器页面的宽度应该等于设备的宽度。
initial-scale：初始的缩放比例。
minimum-scale：允许用户缩放到的最小比例。
maximum-scale：允许用户缩放到的最大比例。
user-scalable：用户是否可以手动缩放。
2.
width指定虚拟窗口的屏幕宽度大小为450.
3.
是iphone的私有标签，它指定的iphone中safari顶端的状态条的样式；
在web app应用下状态条(屏幕顶部条)的颜色；
默认值为default(白色)，可以定为black(黑色)和black-translucent(灰色半透明)。
注意：若值为“black-translucent”将会占据页面px位置，浮在页面上方(会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px)。
转载时请注明出处及相应链接，本文永久地址：/3200.html
微信打赏
支付宝打赏
感谢您对作者Eva的打赏，我们会更加努力！如果您想成为作者，请点我
