移动端开发meta标签的使用

移动端开发meta标签的使用

一、viewport的使用，

在浏览器中页面将以原始大小显示，并不允许缩放

<metaname="viewport"content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>

注释：

initial-scale:初始的缩放比例（范围从>0到10）

minimum-scale:允许用户缩放到的最小比例
maximum-scale:允许用户缩放到的最大比例
user-scalable:用户是否可以手动缩放

二、

作者

<metaname="author"content="作者"/>

三、meta设置手机号码

在浏览器中页面中将不以拨号的超链接的形式出现

<metaname="format-detection"content="telephone=no">

四、忽略页面邮箱识别

<metaname="format-detection"content="email=no"/>

五、添加webapp支持

<metaname="apple-mobile-web-app-capable"content="yes"/>

六、设置webapp顶部状态条黑色

black/半透明色black-translucent（默认白色）

<metaname="apple-touch-fullscreen"content="yes">

七、iphone-全屏显示

<metaname="apple-touch-fullscreen"content="yes">

八、iphone-删除工具栏

<metaname="apple-mobile-web-app-capable"content="no"/>

九、网页图标设置

<link rel="apple-touch-icon"href="iphone.png"/>

<link rel="apple-touch-icon-precomposed"href="iphone.png"/>

10、启动图片设置

<link rel="apple-touch-startup-image" href="start.png" />