webapp之路--meta标签format-detection、apple-mobile-web-app-capable

1、

format-detection翻译成中文的意思是“格式检测”,顾名思义,它是用来检测html里的一些格式的,那关于meta的format-detection属性主要是有以下几个设置:

meta name="format-detection" content="telephone=no"

meta name="format-detection" content="email=no"

meta name="format-detection" content="adress=no"

也可以连写:meta name="format-detection" content="telephone=no,email=no,adress=no"

下面具体说下每个设置的作用:

一、telephone

你明明写的一串数字没加链接样式,而iPhone会自动把你这个文字加链接样式、并且点击这个数字还会自动拨号!想去掉这个拨号链接该如何操作呢?这时我们的meta又该大显神通了,代码如下:

telephone=no就禁止了把数字转化为拨号链接!
telephone=yes就开启了把数字转化为拨号链接,要开启转化功能,这个meta就不用写了,在默认是情况下就是开启!

二、email

告诉设备不识别邮箱,点击之后不自动发送

email=no禁止作为邮箱地址!
email=yes就开启了把文字默认为邮箱地址,这个meta就不用写了,在默认是情况下就是开启!

三、adress

adress=no禁止跳转至地图!
adress=yes就开启了点击地址直接跳转至地图的功能,在默认是情况下就是开启!

2、

Meta 之 apple-mobile-web-app-capable

<meta name=”apple-mobile-web-app-capable” content=”yes” />

这meta的作用就是删除默认的苹果工具栏和菜单栏。content有两个值”yes”和”no”,当我们需要显示工具栏和菜单栏时,这个行meta就不用加了,默认就是显示。

加了该meta的情况

Meta 之 apple-mobile-web-app-status-bar-style

<meta name=”apple-mobile-web-app-status-bar-style” content=”default” />
<meta
name=”apple-mobile-web-app-status-bar-style” content=”black” />
<meta
name=”apple-mobile-web-app-status-bar-style” content=”black-translucent”
/>
 作用是控制状态栏显示样式
status-bar-style:black

status-bar-style:black-translucent

时间: 2024-08-04 20:26:06

webapp之路--meta标签format-detection、apple-mobile-web-app-capable的相关文章

meta标签的理解

一直习惯的使用meta标签,还真么认真理解过,至少英文意思都还没弄明白... 下面是摘自网络的解释: 互动百科: 元素可提供相关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词. 标签位于文档的头部,不包含任何内容. 标签的属性定义了与文档相关联的名称/值对.例如加入关键字会自动被大型搜索网站自动搜集:可以设定页面格式及刷新等等.meta标签共有两个属性,它们分别是http-equiv属性和name属性,不同的属性又有不同的参数值,这些不同的参数值就实现

meta标签大全

meta标签大全 <!-- x-ua-compatible(浏览器兼容模式) 仅对IE8+以效 告诉浏览器以什么版本的IE的兼容模式来显示网页 <meta http-equiv="X-UA-Compatible" content="IE=5" > <meta http-equiv="X-UA-Compatible" content="IE=7" > <meta http-equiv=&quo

手机页面中的meta标签

以前看书的时候,觉得meta标签就只有一个charset对于我来说是有用的.前段时间有个学弟让我写个手机版的网页,我才知道原来meta标签有那么多学问. meta指元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词. 标签位于文档的头部,不包含任何内容. 标签的属性定义了与文档相关联的名称/值对. meta标签的作用有:搜索引擎优化(SEO),定义页面使用语言,自动刷新并指向新的页面,实现网页转换时的动态效果,控制页面缓冲,网页定级评价,控制

手机页面的 HTML&lt;meta&gt; 标签使用与说明

name="viewport" 设置窗口(网页可绘制的区域) width="device-width" 应用宽与屏幕的宽一样的 (height同width) initial-scale="1.0" 应用程序启动是缩放尺寸 minmum-scale="1.0" 用户可缩放的最小尺寸,1.0表示不缩放(maxmum-scale同minmum-scale) user-scalable="no" 用户可用手势缩放

HTML5 常用meta 标签 属性

在iPhone的浏览器中页面将以原始大小显示,不允许缩放.  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">    width - viewport的宽度 height - viewport的高度   initial-scale - 初始的缩放比例  

移动端实用的meta标签

直接上代码,代码自有颜如玉 代码自有黄金屋啊 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="author" content="www.zevertech.com" /><!--可以忽略--> <meta http-equiv="copyright&

WebApp之Meta标签

<meta name="apple-touch-fullscreen" content="yes">"添加到主屏幕"后,全屏显示 <meta name="apple-mobile-web-app-capable" content="yes" />这meta的作用就是删除默认的苹果工具栏和菜单栏.content有两个值"yes"和"no",当我们

移动平台的WebApp之Meta标签

对于桌面平台web布局中大家对meta标签再熟悉不过了,它永远位于 head 元素内部,对做SEO的朋友一定对meta有种特殊的感情吧,今天我们就来说说移动平台的meta标签,在移动平台meta标签究竟有哪些神奇的功效呢? 1.Meta 之 viewport 说到移动平台meta标签,那就不得不说一下viewport了,那么什么是viewport呢? viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域 .对于传统WEB页

WebApp 里Meta标签大全

1.先说说mate标签里的viewport: viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域.对于传统WEB页面来说,980的宽度在iphone上显示是很正常的,也是满屏的,但对于webapp而言,可能就有点问题了,在iphone上我们的webapp在竖屏下通常宽度都是320. 因此我们必须改变viewport,我们就有如下几种属性值可以设置: width: viewport 的宽度 (范围从 200 到 10,00