<meta charset=\公众utf-8\"大众>
<meta http-equiv=\"大众x-ua-compatible\"大众 content=\"大众ie=edge\"大众>
<meta name=\"大众viewport\"大众 content=\"大众width=device-width, initial-scale=1, shrink-to-fit=no\"大众>

<!-- 以上 3 个 meta 标签 必须 放在 head 的最前面;其他任何的 head 内容必须在这些标签的 后面 -->
<title>页面标题</title>
网页元素有效的 <head> 元素包括 meta、link、title、style、script、noscript 和 base。
<!-- 设置此文档的字符编码(如果没有设置),以便 UTF-8 范围中的所有字符(如 emoji)都能精确显示 -->
<meta charset=\"大众utf-8\"大众>
<!-- 设置文档标题 -->
<title>页面标题</title>
<!-- 基本 URL 浸染于文档中所包含的所有相对 URL -->
<base href=\公众https://example.com/page.html\公众>
<!-- 链接外部 CSS 文件 -->
<link rel=\"大众stylesheet\"大众 href=\"大众styles.css\公众>
<!-- 用于文档内的 CSS -->
<style>
/ ... /
</style>
<!-- JavaScript & No-JavaScript 标签 -->
<script>
// function(s) go here
</script>
<noscript>
<!--无 JS 时显示-->
</noscript>
Meta 标签<meta> 标签供应了文档如何被其他技能(如,机器、搜索引擎、浏览器等)理解和渲染的信息。
<!-- 设置此文档的字符编码(如果没有设置),以便 UTF-8 范围中的所有字符(如 emoji)都能精确显示 -->
<meta charset=\公众utf-8\"大众>
<meta http-equiv=\"大众x-ua-compatible\公众 content=\"大众ie=edge\"大众><!-- † -->
<meta name=\"大众viewport\"大众 content=\"大众width=device-width, initial-scale=1, shrink-to-fit=no\"大众>
<!--
以上 3 个 meta 标签 必须 放在 head 的最前面;其他任何的 head 内容必须在这些标签的 后面
† 如果您的项目必须支持 Internet Explorer 11 之前的版本,请利用 content=\公众ie-edge\"大众 标签。
-->
<!-- 许可掌握资源从何处加载。在 <head> 中尽可能地靠前放置,由于该标签仅适用于在其之后声明的资源。-->
<meta http-equiv=\"大众Content-Security-Policy\"大众 content=\"大众default-src 'self'\"大众>
<!-- Web 运用的名称(仅当网站被用作为一个运用时才利用)-->
<meta name=\"大众application-name\"大众 content=\"大众运用名称\"大众>
<!-- 针对页面的简短描述(限定 150 字符)-->
<!-- 此内容可能被用作搜索引擎结果的一部分。 -->
<meta name=\"大众description\公众 content=\公众一个页面描述\"大众>
<!-- 掌握搜索引擎的抓取和索引行为 -->
<meta name=\"大众robots\公众 content=\"大众index,follow\公众><!-- 所有搜索引擎 -->
<meta name=\公众googlebot\"大众 content=\"大众index,follow\"大众><!-- 仅对 Google 有效 -->
<!-- 见告 Google 不显示网站链接的搜索框 -->
<meta name=\公众google\"大众 content=\公众nositelinkssearchbox\公众>
<!-- 见告 Google 不供应此页面的翻译 -->
<meta name=\公众google\"大众 content=\"大众notranslate\"大众>
<!-- 验证网址所有权 -->
<meta name=\公众google-site-verification\"大众 content=\"大众verification_token\"大众><!-- Google Search Console -->
<meta name=\公众yandex-verification\"大众 content=\"大众verification_token\公众><!-- Yandex Webmasters -->
<meta name=\公众msvalidate.01\公众 content=\"大众verification_token\"大众><!-- Bing Webmaster Center -->
<meta name=\"大众alexaVerifyID\"大众 content=\公众verification_token\"大众><!-- Alexa Console -->
<meta name=\"大众p:domain_verify\"大众 content=\公众code from pinterest\公众><!-- Pinterest Console -->
<meta name=\公众norton-safeweb-site-verification\"大众 content=\"大众norton code\公众><!-- Norton Safe Web -->
<!-- 确定用于构建页面的软件(如 - WordPress、Dreamweaver)-->
<meta name=\公众generator\公众 content=\"大众program\"大众>
<!-- 关于你的网站主题的简短描述 -->
<meta name=\"大众subject\公众 content=\公众你的网站主题\公众>
<!-- 基于网站内容给出一样平常的年事分级 -->
<meta name=\"大众rating\"大众 content=\公众General\公众>
<!-- 许可掌握 referrer 信息如何通报 -->
<meta name=\"大众referrer\"大众 content=\"大众no-referrer\"大众>
<!-- 禁用自动检测和格式化可能的电话号码 -->
<meta name=\公众format-detection\"大众 content=\公众telephone=no\"大众>
<!-- 通过设置为 \"大众off\公众 完备退出 DNS 预取 -->
<meta http-equiv=\"大众x-dns-prefetch-control\"大众 content=\"大众off\"大众>
<!-- 在客户端存储 cookie,web 浏览器的客户端识别 -->
<meta http-equiv=\"大众set-cookie\公众 content=\"大众name=value; expires=date; path=url\"大众>
<!-- 指定要显示在一个特定框架中的页面 -->
<meta http-equiv=\公众Window-Target\公众 content=\公众_value\"大众>
<!-- 地理标签 -->
<meta name=\"大众ICBM\公众 content=\公众latitude, longitude\公众>
<meta name=\公众geo.position\公众 content=\"大众latitude;longitude\"大众>
<meta name=\"大众geo.region\"大众 content=\"大众country[-state]\"大众><!-- 国家代码 (ISO 3166-1): 逼迫性, 州代码 (ISO 3166-2): 可选; 如 content=\"大众US\"大众 / content=\"大众US-NY\"大众 -->
<meta name=\公众geo.placename\"大众 content=\"大众city/town\"大众><!-- 如 content=\"大众New York City\"大众 -->
链接<!-- 指向外部 CSS 样式表 -->
<link rel=\公众stylesheet\公众 href=\公众https://example.com/styles.css\"大众>
<!-- 有助于防止涌现内容重复的问题 -->
<link rel=\"大众canonical\"大众 href=\"大众https://example.com/2010/06/9-things-to-do-before-entering-social-media.html\"大众>
<!-- 之前用于包含 icon 的链接,但目前已被废弃 -->
<link rel=\公众shortlink\"大众 href=\公众https://example.com/?p=42\"大众>
<!-- 链接到当前文档的一个 AMP HTML 版本 -->
<link rel=\"大众amphtml\"大众 href=\"大众https://example.com/path/to/amp-version.html\"大众>
<!-- 链接到一个指定 Web 运用程序“安装”凭据的 JSON 文件 -->
<link rel=\"大众manifest\"大众 href=\"大众manifest.json\"大众>
<!-- 链接到关于页面所有者的信息 -->
<link rel=\公众author\"大众 href=\公众humans.txt\"大众>
<!-- 指向一个适用于链接内容的版权申明 -->
<link rel=\"大众license\公众 href=\"大众copyright.html\"大众>
<!-- 给出可能的你的另一种措辞的文档位置参考 -->
<link rel=\"大众alternate\公众 href=\公众https://es.example.com/\"大众 hreflang=\"大众es\公众>
<!-- 供应了关于作者或其他人的信息 -->
<link rel=\"大众me\"大众 href=\公众https://google.com/profiles/thenextweb\"大众 type=\"大众text/html\公众>
<link rel=\"大众me\公众 href=\公众mailto:name@example.com\"大众>
<link rel=\公众me\"大众 href=\"大众sms:+15035550125\公众>
<!-- 链接到一个描述历史记录、文档或其他具有历史意义的材料的凑集的文档 -->
<link rel=\公众archives\公众 href=\"大众https://example.com/archives/\公众>
<!-- 链接到层次构造中的顶级资源 -->
<link rel=\"大众index\"大众 href=\"大众https://example.com/\"大众>
<!-- 供应了自我引用 - 当文档有多个可能的引用时非常有用 -->
<link rel=\"大众self\"大众 type=\"大众application/atom+xml\公众 href=\公众https://example.com/atomFeed.php?page=3\"大众>
<!-- 分别是在一系列文件中的第一个、下一个、上一个和末了一个 -->
<link rel=\"大众first\"大众 href=\公众https://example.com/atomFeed.php\公众>
<link rel=\公众next\"大众 href=\"大众https://example.com/atomFeed.php?page=4\"大众>
<link rel=\"大众prev\"大众 href=\"大众https://example.com/atomFeed.php?page=2\公众>
<link rel=\"大众last\"大众 href=\"大众https://example.com/atomFeed.php?page=147\"大众>
<!-- 当利用第三方做事来掩护博客时利用 -->
<link rel=\"大众EditURI\"大众 href=\公众https://example.com/xmlrpc.php?rsd\"大众 type=\"大众application/rsd+xml\"大众 title=\"大众RSD\"大众>
<!-- 当另一个 WordPress 博客链接到你的 WordPress 博客或文章时形成一个自动化的评论 -->
<link rel=\"大众pingback\"大众 href=\"大众https://example.com/xmlrpc.php\"大众>
<!-- 当你在自己的页面上链接到一个 url 时关照它 -->
<link rel=\"大众webmention\"大众 href=\公众https://example.com/webmention\公众>
<!-- 启用通过 Micropub 客户端发布你的域名 -->
<link rel=\"大众micropub\"大众 href=\公众https://example.com/micropub\公众>
<!-- 加载一个外部的 HTML 文件到当前页面 -->
<link rel=\"大众import\公众 href=\"大众/path/to/component.html\"大众>
<!-- 打开搜索 -->
<link rel=\"大众search\"大众 href=\"大众/open-search.xml\"大众 type=\"大众application/opensearchdescription+xml\公众 title=\公众Search Title\公众>
<!-- Feeds -->
<link rel=\公众alternate\"大众 href=\"大众https://feeds.feedburner.com/example\"大众 type=\"大众application/rss+xml\"大众 title=\公众RSS\公众>
<link rel=\"大众alternate\"大众 href=\"大众https://example.com/feed.atom\"大众 type=\公众application/atom+xml\"大众 title=\"大众Atom 0.3\"大众>
<!-- 预取,预载,预浏览 -->
<!-- 更多信息:https://css-tricks.com/prefetching-preloading-prebrowsing/ -->
<link rel=\"大众dns-prefetch\"大众 href=\公众//example.com/\公众>
<link rel=\"大众preconnect\"大众 href=\"大众https://www.example.com/\"大众>
<link rel=\"大众prefetch\"大众 href=\"大众https://www.example.com/\"大众>
<link rel=\"大众prerender\"大众 href=\公众https://example.com/\"大众>
<link rel=\"大众preload\公众 href=\"大众image.png\"大众 as=\"大众image\公众>
网站图标<!-- 针对 IE 10 及以下版本 -->
<!-- 如果将 `favicon.ico` 放在根目录下,则无需标签 -->
<!-- 对付 IE 11、Chrome、Firefox、Safari 和 Opera -->
<link rel=\"大众icon\"大众 type=\"大众image/png\"大众 sizes=\"大众16x16\"大众 href=\公众/path/to/favicon-16x16.png\"大众>
<link rel=\公众icon\"大众 type=\公众image/png\"大众 sizes=\"大众32x32\"大众 href=\公众/path/to/favicon-32x32.png\公众>
<link rel=\"大众icon\公众 type=\公众image/png\"大众 sizes=\公众96x96\"大众 href=\"大众/path/to/favicon-96x96.png\公众>
<!-- 更多信息: https://bitsofco.de/all-about-favicons-and-touch-icons/ -->
社交Facebook Open Graph<meta property=\公众fb:app_id\"大众 content=\"大众123456789\"大众>
<meta property=\"大众og:url\"大众 content=\"大众https://example.com/page.html\公众>
<meta property=\"大众og:type\"大众 content=\公众website\"大众>
<meta property=\公众og:title\公众 content=\"大众Content Title\"大众>
<meta property=\公众og:image\公众 content=\公众https://example.com/image.jpg\"大众>
<meta property=\"大众og:description\"大众 content=\"大众Description Here\"大众>
<meta property=\"大众og:site_name\公众 content=\公众Site Name\公众>
<meta property=\"大众og:locale\公众 content=\"大众en_US\"大众>
<meta property=\公众article:author\公众 content=\"大众\公众>
Twitter Card<meta name=\"大众twitter:card\公众 content=\"大众summary\"大众>
<meta name=\公众twitter:site\"大众 content=\"大众@site_account\公众>
<meta name=\"大众twitter:creator\"大众 content=\公众@individual_account\"大众>
<meta name=\公众twitter:url\"大众 content=\"大众https://example.com/page.html\"大众>
<meta name=\"大众twitter:title\"大众 content=\公众Content Title\"大众>
<meta name=\"大众twitter:description\"大众 content=\"大众Content description less than 200 characters\"大众>
<meta name=\公众twitter:image\公众 content=\"大众https://example.com/image.jpg\公众>
Twitter Privacy如果你在自己的网站中嵌入了推文,Twitter 可以利用你网站上的信息为 Twitter 用户定制内容和建议。
<!-- 禁止 Twitter 利用你网站上的信息用于供应个性化的目的 -->
<meta name=\"大众twitter:dnt\"大众 content=\"大众on\公众>
Google+ / Schema.org<link href=\"大众https://plus.google.com/+YourPage\"大众 rel=\公众publisher\"大众>
<meta itemprop=\"大众name\"大众 content=\公众内容标题\公众>
<meta itemprop=\"大众description\公众 content=\"大众内容描述少于 200 个字符\"大众>
<meta itemprop=\"大众image\"大众 content=\"大众https://example.com/image.jpg\"大众>
Pinterest根据他们的帮助中央可知,Pinterest 许可你禁止他人保存你网站里的内容。description 为可选。
<meta name=\"大众pinterest\"大众 content=\"大众nopin\"大众 description=\公众Sorry, you can't save from my website!\"大众>
Facebook Instant Articles<meta charset=\"大众utf-8\公众>
<meta property=\公众op:markup_version\"大众 content=\公众v1.0\"大众>
<!-- 你的文章的 Web 版网址 -->
<link rel=\"大众canonical\"大众 href=\"大众https://example.com/article.html\"大众>
<!-- 用于该文章的样式 -->
<meta property=\"大众fb:article_style\"大众 content=\公众myarticlestyle\公众>
OEmbed<link rel=\"大众alternate\"大众 type=\"大众application/json+oembed\"大众
href=\公众https://example.com/services/oembed?url=http%3A%2F%2Fexample.com%2Ffoo%2F&format=json\"大众
title=\公众oEmbed Profile: JSON\"大众>
<link rel=\"大众alternate\"大众 type=\"大众text/xml+oembed\公众
href=\"大众https://example.com/services/oembed?url=http%3A%2F%2Fexample.com%2Ffoo%2F&format=xml\"大众
title=\公众oEmbed Profile: XML\公众>
浏览器 / 平台Apple iOS<!-- 智能运用 Banner -->
<meta name=\"大众apple-itunes-app\公众 content=\"大众app-id=APP_ID,affiliate-data=AFFILIATE_ID,app-argument=SOME_TEXT\公众>
<!-- 禁用自动检测和格式化可能的电话号码 -->
<meta name=\"大众format-detection\"大众 content=\"大众telephone=no\"大众>
<!-- 添加到主屏幕 -->
<meta name=\"大众apple-mobile-web-app-capable\公众 content=\"大众yes\公众>
<meta name=\"大众apple-mobile-web-app-status-bar-style\"大众 content=\"大众black\公众>
<meta name=\公众apple-mobile-web-app-title\公众 content=\"大众运用标题\"大众>
<!-- 触摸图标 -->
<!-- 在大多数情形下,在 <head>中,一个 180×180px 触摸图标就已经足够了 -->
<link rel=\"大众apple-touch-icon\"大众 href=\"大众/path/to/apple-touch-icon.png\"大众>
<!-- 启动画面(已无效) -->
<link rel=\公众apple-touch-startup-image\公众 href=\公众path/to/startup.png\公众>
<!-- iOS 运用深层链接 -->
<meta name=\"大众apple-itunes-app\"大众 content=\"大众app-id=APP-ID, app-argument=http/url-sample.com\"大众>
<link rel=\公众alternate\公众 href=\"大众ios-app://APP-ID/http/url-sample.com\"大众>
Apple Safari<!-- 固定网站 -->
<link rel=\"大众mask-icon\"大众 href=\公众path/to/icon.svg\"大众 color=\"大众red\公众>
Google Android<meta name=\公众theme-color\"大众 content=\公众#E64545\公众>
<!-- 添加到主屏幕 -->
<meta name=\"大众mobile-web-app-capable\公众 content=\"大众yes\公众>
<!-- 更多信息:https://developer.chrome.com/multidevice/android/installtohomescreen -->
Google Chrome<link rel=\"大众chrome-webstore-item\"大众 href=\"大众https://chrome.google.com/webstore/detail/APP_ID\"大众>
<!-- 禁用翻译提示 -->
<meta name=\"大众google\"大众 content=\"大众notranslate\"大众>
Google Chrome Mobile (只针对 Android)从 Chrome 31 开始,你可以设置你的 Web 运用为“app mode”,如 Safari。
<!-- 链接到一个 manifest 并定义 manifest 的元数据 -->
<!-- manifest.json 中的例子也可以通过以下链接找到 -->
<link rel=\公众manifest\"大众 href=\"大众manifest.json\"大众>
<!-- 定义你的网页为 Web 运用 -->
<meta name=\公众mobile-web-app-capable\公众 content=\"大众yes\"大众>
<!-- 主屏幕图标 -->
<link rel=\"大众icon\"大众 sizes=\公众192x192\公众 href=\公众/path/to/highres-icon.png\公众>
Microsoft Internet Explorer<meta http-equiv=\公众x-ua-compatible\公众 content=\"大众ie=edge\"大众>
<meta name=\公众skype_toolbar\"大众 content=\"大众skype_toolbar_parser_compatible\公众>
<!-- IE10: 禁用链接点击高亮 (https://blogs.windows.com/buildingapps/2012/11/15/adapting-your-webkit-optimized-site-for-internet-explorer-10/) -->
<meta name=\"大众msapplication-tap-highlight\"大众 content=\"大众no\"大众>
<!-- 固定网站 (https://msdn.microsoft.com/en-us/library/dn255024(v=vs.85).aspx) -->
<meta name=\"大众application-name\"大众 content=\"大众Sample Title\"大众>
<meta name=\"大众msapplication-tooltip\公众 content=\公众A description of what this site does.\公众>
<meta name=\"大众msapplication-starturl\公众 content=\"大众https://example.com/index.html?pinned=true\"大众>
<meta name=\"大众msapplication-navbutton-color\"大众 content=\"大众#FF3300\"大众>
<meta name=\"大众msapplication-window\公众 content=\"大众width=800;height=600\"大众>
<meta name=\公众msapplication-task\"大众 content=\"大众name=Task 1;action-uri=https://host/Page1.html;icon-uri=https://host/icon1.ico\"大众>
<meta name=\"大众msapplication-task\"大众 content=\"大众name=Task 2;action-uri=https://microsoft.com/Page2.html;icon-uri=https://host/icon2.ico\"大众>
<meta name=\"大众msapplication-badge\"大众 value=\"大众frequency=NUMBER_IN_MINUTES;polling-uri=https://example.com/path/to/file.xml\"大众>
<meta name=\公众msapplication-TileColor\"大众 content=\公众#FF3300\"大众>
<meta name=\公众msapplication-TileImage\"大众 content=\"大众path/to/tileimage.jpg\"大众>
<meta name=\"大众msapplication-config\公众 content=\公众https://example.com/browserconfig.xml\公众>
<meta name=\公众msapplication-notification\公众 content=\"大众frequency=60;polling-uri=https://example.com/livetile;polling-uri2=https://example.com/livetile2\公众>
<meta name=\公众msapplication-task-separator\"大众 content=\"大众1\"大众>
海内的浏览器360 浏览器<!-- 选择渲染引擎 -->
<meta name=\"大众renderer\公众 content=\公众webkit|ie-comp|ie-stand\"大众>
QQ 移动浏览器<!-- 在指定方向上锁定屏幕(锁定横/竖屏) -->
<meta name=\公众x5-orientation\"大众 content=\"大众landscape/portrait\"大众>
<!-- 全屏显示此页面 -->
<meta name=\公众x5-fullscreen\"大众 content=\公众true\公众>
<!-- 页面将以“运用模式”显示(全屏等)-->
<meta name=\"大众x5-page-mode\"大众 content=\公众app\公众>
UC 移动浏览器<!-- 在指定方向上锁定屏幕(锁定横/竖屏) -->
<meta name=\公众screen-orientation\公众 content=\公众landscape/portrait\"大众>
<!-- 全屏显示此页面 -->
<meta name=\"大众full-screen\公众 content=\"大众yes\公众>
<!-- 纵然在“文本模式”下,UC 浏览器也会显示图片 -->
<meta name=\"大众imagemode\"大众 content=\"大众force\"大众>
<!-- 页面将以“运用模式”显示(全屏、禁止手势等) -->
<meta name=\"大众browsermode\"大众 content=\公众application\"大众>
<!-- 在此页面禁用 UC 浏览器的“夜间模式” -->
<meta name=\公众nightmode\"大众 content=\"大众disable\公众>
<!-- 简化页面,减少数据传输 -->
<meta name=\公众layoutmode\"大众 content=\公众fitscreen\"大众>
<!-- 禁用的 UC 浏览器的功能,“当此页面中有较多文本时缩放字体” -->
<meta name=\公众wap-font-scale\"大众 content=\"大众no\"大众>
运用链接<!-- iOS -->
<meta property=\"大众al:ios:url\公众 content=\"大众applinks://docs\"大众>
<meta property=\"大众al:ios:app_store_id\公众 content=\"大众12345\"大众>
<meta property=\"大众al:ios:app_name\"大众 content=\"大众App Links\"大众>
<!-- Android -->
<meta property=\"大众al:android:url\公众 content=\"大众applinks://docs\公众>
<meta property=\公众al:android:app_name\"大众 content=\"大众App Links\公众>
<meta property=\"大众al:android:package\公众 content=\"大众org.applinks\"大众>
<!-- 页面回退 -->
<meta property=\"大众al:web:url\"大众 content=\公众https://applinks.org/documentation\公众