apple-mobile-web-app-title
android web 应用程序是否有相当于 iOS 6 元标记?可以让您定义长标题和短标题的东西。
<title>Long name</title>
<meta name="apple-mobile-web-app-title" content="Short name">
apple-mobile-web-app-title
android web 应用程序是否有相当于 iOS 6 元标记?可以让您定义长标题和短标题的东西。
<title>Long name</title>
<meta name="apple-mobile-web-app-title" content="Short name">
这可以使用“应用程序名称”元标记来实现。然而,它似乎只适用于 chrome。Firefox 和 android 浏览器不使用标题标签
<head> ... <meta name="application-name" content="Awesome App!"> ... </head>
来自,Web 应用程序中的用法部分
http://w3c-webmob.github.io/installable-webapps/
创建一个名为 的 JSON 文件site.webmanifest
,如下所示:
{
"name": "Long name",
"short_name": "Short name",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}
然后将其添加到您的 HTML 中,如下所示:
<link rel="manifest" href="/site.webmanifest">
该"icons"
部分与您的问题无关,但您可能也应该包括它们(并实际制作这些图标文件)。我从这篇文章中得到了这个:https ://dev.to/masakudamatsu/favicon-nightmare-how-to-maintain-sanity-3al7
一种方法是使用 javascript 检测移动浏览器,然后将document.title更改为更短的标题:
if (navigator.userAgent.match(/(iPad|iPhone|iPod|Android|Silk)/gi))
document.title = "Short Title";