Meta标签中的apple-mobile-web-app-capable属性及含义

最新推荐文章于 2020-05-15 11:31:28 发布
原创 最新推荐文章于 2020-05-15 11:31:28 发布 · 503 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了一个meta标签的使用方法，该标签用于控制iOS设备上网页应用的工具栏和菜单栏是否显示。通过设置content属性为'yes'或'no'，可以实现这些元素的隐藏或展示。

这meta的作用就是删除默认的苹果工具栏和菜单栏。

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

ios全屏模式下避免跳转到safari浏览器，在苹果safari上实现全屏效果（让web页面以独立app的形式运行）
03-22 5083
添加meta标签，打开谷歌浏览器点击添加到主屏幕，重新启动，实现自动全屏（没有底部的地址栏了）。你可能不知道的一个功能：web 单页面应用可以在手机端以类似独立 app 的形式运行。有了这种功能，我们还需要给独立web页面添加一个在桌面上显示的图标。如果不放心，就再配合下面这个meta，将顶部状态栏变为白色。为透明，内容滚动的时候，透过状态栏可以看到下面的内容。重点是在safari中打开，然后点击中间的分享，找到。，应用以全屏模式运行，否则不会在全屏中运行。为不透明，看不到下面的内容。
苹果IOS在Safari浏览器中将网页添加到主屏幕做伪Web App，自定义图标，启动动画，自定义名称，全屏应用pwa
03-23 1万+
通过点击桌面上的图标，直接打开全屏页面:(这图标是我用优快云的图标，嘻嘻，官方应该不介意吧)具体实现步骤一共三步：1.网站添加样式，2.添加到桌面图标，3.打开桌面图标。
meta标签中apple-mobile-web-app-capable
liukai6的博客
08-01 2437
<meta name="apple-mobile-web-app-capable" content="yes" /> 删除默认的苹果工具栏和菜单栏,将值设置为no。 需要显示工具栏和菜单栏时，不需要添加，默认值为yes，即显示。...
<meta name="apple-mobile-web-app-capable" content="yes"> is deprecated. Please include <meta name="mobile-web-app-capable" content="yes">
最新发布
09-08
`<meta name="apple-mobile-web-app-capable" content="yes">` 这个元标记用于指定网站是否支持苹果手机上的“移动Web应用模式”（Mobile Safari）。然而，这个标记已经被认为过时，并在某些新的浏览器版本中不再...
<meta name="apple-mobile-web-app-capable" content="yes">
06-10
如果将这个 meta 标签的 content 属性设置为 "yes"，则表示当前网页可以启用全屏模式。 在启用全屏模式后，用户可以将当前网页添加到 iOS 设备的主屏幕上，就像添加一个原生应用一样。这样，在用户点击网页图标时，...
apple-mobile-web-app-capable
03-16
apple-mobile-web-app-capable是一个meta标签，用于指定网站是否可以在iOS设备上以全屏模式运行。如果设置为“yes”，则用户可以将网站添加到主屏幕，并在全屏模式下访问。如果设置为“no”，则网站将在Safari浏览器...
<link rel="manifest" href="/manifest.json"> <meta name="theme-color" content="#ffffff"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="viewport" content="width=device-width,initial-scale=1.0">都是什么意思
05-17
- `<meta name="apple-mobile-web-app-capable" content="yes">`：用于指定在 iOS 设备上是否可以将网站添加到主屏幕并运行为 Web App。 - `<meta name="apple-mobile-web-app-status-bar-style" content="black">`...
meta name="apple-mobile-web-app-capable"
2shou
09-16 4143
如何让 web 页面以独立 app 的形式运行 meta: apple-mobile-web-app-capable
学习笔记
05-15 8299
如何让 web 页面以独立 app 的形式运行 meta: apple-mobile-web-app-capable 看个例子 你可能不知道的一个功能： web 单页面应用可以在手机端以类似独立 app 的形式运行。 就像下面这样， 没有上下的工具栏 切换的时候跟普通 app 没什么两样 让页面实现 standalone 功能 苹果官方对 safari 可用 meta 标签的说明 Safari HTML Reference - Supported Meta Tags 只需要添加下面一行即可 &lt
apple-mobile-web-app-capable作用
weixin_34148340的博客
03-01 838
apple-mobile-web-app-capable是设置Web应用是否以全屏模式运行。 语法结构: 1 <meta name="apple-mobile-web-app-capable" content="yes"> 说明: 如果content设置为yes，Web应用会以全屏模式运行，反之，则不会。...
移动终端浏览器初始设置apple-mobile-web-app-capable （转）
04-24 990
原文地址 http://blog.sina.com.cn/s/blog_4dffbd380100kvht.html 移动终端浏览器默认设置视口的宽度和初始规模。最近做的一个移动终端的项目，遇到一个默认设置更改的问题。起初非常怀疑是自己的html写的有问题。经过一番页面尺寸的测试之后终于找到问题根源。知道是什么问题就可以找解决的方法了。<meta name="viewport" ...
Meta标签中的apple-mobile-web-app属性及含义
weixin_30394633的博客
01-27 636
一、Meta标签中的apple-mobile-web-app-capable属性及含义 这meta的作用就是删除默认的苹果工具栏和菜单栏。 content有两个值”yes”和”no”,当我们需要显示工具栏和菜单栏时，这个行meta就不用加了，默认就是显示。 二、Meta标签中的apple-mobile-web-app-status-bar-style属性及含义 “apple-mobi...
WebApp 的 meta 标签
chenping6296的博客
03-22 277
WebApp 的 meta 标签 apple-mobile-web-app-capable设置Web应用是否以全屏模式运行。 语法： <meta name="apple-mobile-web-app-capable" content="yes"> 说明： ...
meta name="apple-mobile-web-app-status-bar-style" content="black"
热门推荐
飞鸿的博客
06-16 2万+
webapp里主要的mate用途&lt;meta name="apple-touch-fullscreen" content="yes"&gt;  添加到主屏幕后，全屏显示。&lt;meta name="apple-mobile-web-app-capable" content="yes" /&gt;这meta的作用就是删除默认的苹果工具栏和菜单栏。content有两个值”yes”和”no”,当我
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值