手机端页面meta标签

Posted mo3408

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了手机端页面meta标签相关的知识,希望对你有一定的参考价值。

1、<meta name="viewport" id="viewport" content="width=device-width, initial-scale=1">
网页手机wap2.0网页的head里加入下面这条元标签,在iPhone的浏览器中页面将以原始大小显示,并不允许缩放。
说到移动平台meta标签,那就不得不说一下viewport了,那么什么是viewport呢?
viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏、状态栏、滚动条等等之后用于看网页的区域
2、<meta name="format-detection" content="telephone=no">
当该 html 页面在手机上浏览时,该标签用于指定是否将网页内容中的手机号码显示为拨号的超链接。
在 iPhone 上默认值是:
<meta name="format-detection" content="telephone=yes"/>
如果你不希望手机自动将网页中的电话号码显示为拨号的超链接,那么可以这样写:
<meta name="format-detection" content="telephone=no"/>
3、<meta name="apple-mobile-web-app-capable" content="yes" />
说明:网站开启对web app程序的支持。
4、<meta name="apple-mobile-web-app-status-bar-style" content="black" />
说明:
在web app应用下状态条(屏幕顶部条)的颜色;
默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明)。
注意:若值为“black-translucent”将会占据页面px位置,浮在页面上方(会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px)。

以上是关于手机端页面meta标签的主要内容,如果未能解决你的问题,请参考以下文章

转载·收藏 html5手机网站自适应需要加的meta标签

手机H5移动端WEB资源整合之meta标签

pc端页面添加meta标签:X-UA-Compatible meta标签

移动端手机web前端meta通用设置

移动端meta常用

使用视 meta 标签来控制手机浏览器布局