元素可提供有關(guān)頁面的元信息（meta-information），比如針對搜索引擎和更新頻度的描述和關(guān)鍵詞。
HTML Meta Tags
HTML Meta 標簽搜集，部分標簽已加中文說明，歡迎補全。
基礎(chǔ) HTML Meta 標簽
<!-- 聲明文檔使用的字符編碼 -->
<meta charset="utf-8">
<!-- 頁面描述 -->
<meta name="description" content="不超過150個字符">
<!-- 頁面關(guān)鍵詞 -->
<meta name="keywords" content="你的, 關(guān)鍵詞">
<meta name="subject" content="your website's subject">
<meta name="copyright" content="company name">
<meta name="language" content="ES">
<!-- 搜索引擎抓取 -->
<meta name="robots" content="index,follow">
<meta name="revised" content="Sunday, July 18th, 2010, 5:15 pm">
<meta name="abstract" content="">
<meta name="topic" content="">
<meta name="summary" content="">
<meta name="Classification" content="Business">
<!-- 網(wǎng)頁作者 -->
<meta name="author" content="name, email@gmail.com">
<!-- 網(wǎng)頁設(shè)計師 -->
<meta name="designer" content="">
<!-- 網(wǎng)頁制作軟件 -->
<meta name="generator" content="VS Code">
<meta name="reply-to" content="email@gmail.com">
<meta name="owner" content="Jeff Design">
<meta name="url" content="http://www.jeffdesign.net">
<meta name="identifier-URL" content="http://www.websiteaddress.com">
<meta name="directory" content="submission">
<meta name="pagename" content="jQuery Tools, Tutorials and Resources - O'Reilly Media">
<meta name="category" content="">
<meta name="coverage" content="Worldwide">
<meta name="distribution" content="Global">
<meta name="rating" content="General">
<!-- 搜索引擎爬蟲重訪時間 -->
<meta name="revisit-after" content="7 days">
<meta name="subtitle" content="This is my subtitle">
<meta name="target" content="all">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="date" content="Sep. 27, 2010">
<meta name="search_date" content="2010-09-27">
<meta name="DC.title" content="Unstoppable Robot Ninja">
<meta name="ResourceLoaderDynamicStyles" content="">
<meta name="medium" content="blog">
<meta name="syndication-source" content="https://www.example.com/2018/12/24/free-brand-monitoring-tools/">
<meta name="original-source" content="https://www.example.com/2018/12/24/free-brand-monitoring-tools/">
<meta name="verify-v1" content="dV1r/ZJJdDEI++fKJ6iDEl6o+TMNtSu0kv18ONeqM0I=">
<meta name="y_key" content="1e39c508e0d87750">
<meta name="pageKey" content="guest-home">
<meta itemprop="name" content="jQTouch">
<meta http-equiv="Expires" content="0">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="imagetoolbar" content="no">
<meta http-equiv="x-dns-prefetch-control" content="off">
<!-- 為移動設(shè)備添加 viewport -->
<!--
width：控制 viewport 的大小，可以指定的一個值，如 600，或者特殊的值，如 device-width 為設(shè)備的寬度（單位為縮放為 100% 時的 CSS 的像素）。
height：和 width 相對應(yīng)，指定高度。
initial-scale：初始縮放比例，也即是當頁面第一次 load 的時候縮放比例。
maximum-scale：允許用戶縮放到的最大比例。
minimum-scale：允許用戶縮放到的最小比例。
user-scalable：用戶是否可以手動縮放。
-->
<meta name="viewport" content="initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no">
<!-- 保留歷史記錄以及動畫效果 -->
<meta name="App-Config" content="fullscreen=yes,useHistoryState=yes,transition=yes">
公司/服務(wù)專用 Meta 標簽
Apple Meta 標簽
<!-- 添加到主屏后的標題（iOS 6 新增） -->
<meta name="apple-mobile-web-app-title" content="My App">
<!-- 是否啟用 WebApp 全屏模式，刪除蘋果默認的工具欄和菜單欄 -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<!-- 設(shè)置蘋果工具欄顏色 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width; width = 320; initial-scale=1.0; maximum-scale=1.0; user-scalable=yes; target-densitydpi=160dpi">
<!-- 添加智能 App 廣告條 Smart App Banner（iOS 6+ Safari） -->
<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">
<link href="/apple-touch-icon.png" rel="apple-touch-icon" type="image/png">
<link href="touch-icon-ipad.png" rel="apple-touch-icon" sizes="72x72">
<link href="touch-icon-iphone4.png" rel="apple-touch-icon" sizes="114x114">
<link href="/startup.png" rel="apple-touch-startup-image">
<!-- Safari 9 Pinned tabs in El Capitan -->
<link rel="mask-icon" href="website_icon.svg" color="red">
<!-- iPhone 和 iTouch，默認 57x57 像素，必須有 -->
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-57x57-precomposed.png"/>
<!-- Retina iPhone 和 Retina iTouch，72x72 像素，可以沒有，但推薦有 -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/apple-touch-icon-72x72-precomposed.png"/>
<!-- Retina iPad，144x144 像素，可以沒有，但推薦有 -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/apple-touch-icon-144x144-precomposed.png"/>
<!-- iPad 豎屏 768 x 1004（標準分辨率） -->
<link rel="apple-touch-startup-image" sizes="768x1004" href="/splash-screen-768x1004.png"/>
<!-- iPad 豎屏 1536x2008（Retina） -->
<link rel="apple-touch-startup-image" sizes="1536x2008" href="/splash-screen-1536x2008.png"/>
<!-- iPad 橫屏 1024x748（標準分辨率） -->
<link rel="apple-touch-startup-image" sizes="1024x748" href="/Default-Portrait-1024x748.png"/>
<!-- iPad 橫屏 2048x1496（Retina） -->
<link rel="apple-touch-startup-image" sizes="2048x1496" href="/splash-screen-2048x1496.png"/>
<!-- iPhone/iPod Touch 豎屏 320x480 (標準分辨率) -->
<link rel="apple-touch-startup-image" href="/splash-screen-320x480.png"/>
<!-- iPhone/iPod Touch 豎屏 640x960 (Retina) -->
<link rel="apple-touch-startup-image" sizes="640x960" href="/splash-screen-640x960.png"/>
<!-- iPhone 5/iPod Touch 5 豎屏 640x1136 (Retina) -->
<link rel="apple-touch-startup-image" sizes="640x1136" href="/splash-screen-640x1136.png"/>
Internet Explorer Meta 標簽
<meta http-equiv="Page-Enter" content="RevealTrans(Duration=2.0,Transition=2)">
<meta http-equiv="Page-Exit" content="RevealTrans(Duration=3.0,Transition=12)">
<meta name="mssmarttagspreventparsing" content="true">
<!-- 優(yōu)先使用 IE 最新版本和 Chrome -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="msapplication-starturl" content="http://www.yourwebsite.com/">
<meta name="msapplication-window" content="width=800;height=600">
<meta name="msapplication-navbutton-color" content="red">
<meta name="application-name" content="Rey Bango Front-end Developer">
<meta name="msapplication-tooltip" content="Launch Rey Bango's Blog">
<meta name="msapplication-task" content="name=About;action-uri=/about/;icon-uri=/images/about.ico">
<meta name="msapplication-task" content="name=The Big List;action-uri=/the-big-list-of-javascript-css-and-html-development-tools-libraries-projects-and-books/;icon-uri=/images/list_links.ico">
<meta name="msapplication-task" content="name=jQuery Posts;action-uri=/category/jquery/;icon-uri=/images/jquery.ico">
<meta name="msapplication-task" content="name=Start Developing;action-uri=/category/javascript/;icon-uri=/images/script.ico">
<meta name="msvalidate.01" content="6E3AD52DC176461A3C81DD6E98003BC9">
<meta http-equiv="cleartype" content="on">
<!-- 忽略頁面中的數(shù)字識別為電話，忽略email識別 -->
<meta name="format-detection" content="telphone=no, email=no"/>
<!-- 雙核瀏覽器渲染方式 -->
<!-- 默認webkit內(nèi)核 -->
<meta name="renderer" content="webkit">
<!-- 默認IE兼容模式 -->
<meta name="renderer" content="ie-comp">
<!-- 默認IE標準模式 -->
<meta name="renderer" content="ie-stand">
<!-- 避免IE使用兼容模式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 不讓百度轉(zhuǎn)碼 -->
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!-- 針對手持設(shè)備優(yōu)化，主要是針對一些老的不識別viewport的瀏覽器，比如黑莓 -->
<meta name="HandheldFriendly" content="true">
<!-- 微軟的老式瀏覽器 -->
<meta name="MobileOptimized" content="320">
<!-- uc強制豎屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ強制豎屏 -->
<meta name="x5-orientation" content="portrait">
<!-- UC強制全屏 -->
<meta name="full-screen" content="yes">
<!-- QQ強制全屏 -->
<meta name="x5-fullscreen" content="true">
<!-- UC應(yīng)用模式 -->
<meta name="browsermode" content="application">
<!-- QQ應(yīng)用模式 -->
<meta name="x5-page-mode" content="app">
<!-- windows phone 點擊無高光 -->
<meta name="msapplication-tap-highlight" content="no">
Windows 8 Meta 標簽
<meta name="application-name" content=" Contoso" />
<!-- Windows 8 磁貼顏色 -->
<meta name="msapplication-TileColor" content=" #009900" />
<!-- Windows 8 磁貼圖標 -->
<meta name="msapplication-TileImage" content="icon.png"/>
<meta name="msapplication-square70x70logo" content="images/smalltile.png" />
<meta name="msapplication-square150x150logo" content="images/mediumtile.png" />
<meta name="msapplication-wide310x150logo" content="images/widetile.png" />
<meta name="msapplication-square310x310logo" content="images/largetile.png" />
<meta name="msapplication-notification" content="frequency=30; polling-uri=notifications/contoso1.xml;
polling-uri2=notifications/contoso2.xml; polling-uri3=notifications/contoso3.xml" />
TweetMeme Meta 標簽
<meta name="tweetmeme-title" content="Retweet Button Explained">
Blog Catalog Meta 標簽
<meta name="blogcatalog">
Rails Meta 標簽
<meta name="csrf-param" content="authenticity_token">
<meta name="csrf-token" content="/bZVwvomkAnwAI1Qd37lFeewvpOIiackk9121fFwWwc=">
ClaimID Meta 標簽
<meta name="microid" content="mailto+http:sha1:e6058ed7fca4a1921cq91d7f1f3b8736cd3cc1g7">
<meta name="readability-verification" content="E7aEHvVQpWc8VHDqKvaB2Z58hek2EAv2HuLuegv7">
<meta name="google-site-verification" content="4SMIedO1X4IkYrYuhEC2VuovdQM36Xxb0btUjElqQyg">
<meta name="ICBM" content="40.746990, -73.980537">
<meta name="generator" content="WordPress 3.3.1">
<meta name="norton-safeweb-site-verification" content="tz8iotmk-pkhui406y41y5bfmfxdwmaa4a-yc0hm6r0fga7s6j0j27qmgqkmc7oovihzghbzhbdjk-uiyrz438nxsjdbj3fggwgl8oq2nf4ko8gi7j4z7t78kegbidl4">
HTML 鏈接類標簽
<!-- 添加 RSS 訂閱 -->
<link rel="alternate" type="application/rss+xml" title="RSS" href="https://example.com/feed.atom">
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="https://example.com/feed.atom">
<!-- 添加 favicon icon -->
<link rel="shortcut icon" type="image/ico" href="/favicon.ico">
<link rel="fluid-icon" type="image/png" href="/fluid-icon.png">
<link rel="me" type="text/html" href="http://google.com/profiles/thenextweb">
<link rel="shortlink" href="http://www.example.com/?p=353">
<link rel="archives" title="May 2003" href="http://www.example.com/2003/05/">
<link rel="index" title="DeWitt Clinton" href="http://www.example.com/">
<link rel="start" title="Pattern Recognition 1" href="http://www.example.com/photos/pattern_recognition_1_about/">
<link rel="bookmark" title="Styleguide" href="http://www.example.com/about/styleguide/">
<link rel="search" href="/search.xml" type="application/opensearchdescription+xml" title="Viatropos">
<link rel="self" type="application/atom+xml" href="http://www.example.com/atomFeed.php?page=3">
<link rel="first" href="http://www.example.com/atomFeed.php">
<link rel="next" href="http://www.example.com/atomFeed.php?page=4">
<link rel="previous" href="http://www.example.com/atomFeed.php?page=2">
<link rel="last" href="http://www.example.com/atomFeed.php?page=147">
<link rel="canonical" href="http://www.example.com/2010/06/9-things-to-do-before-entering-social-media.html">
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.example.com/xmlrpc.php?rsd">
<link rel="pingback" href="http://www.example.com/xmlrpc.php">
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="http://wordpress.org/style/iphone.css" type="text/css">
<link rel="wlwmanifest" href="http://www.example.com/wp-includes/wlwmanifest.xml" type="application/wlwmanifest+xml">
<link rel="help" title="FAQ" href="/faq">
<link rel="logo" type="image/svg" href="https://playfoursquare.s3.amazonaws.com/press/logo/foursquare-logo.svg">
<link rel="P3Pv1" href="/w3c/p3p.xml">
<link rel="publisher" href="https://plus.google.com/115081025762845243709/">
<link rel="image_src" href="http://du3itj18e4z0b.cloudfront.net/7b29fe/images/icon-facebook.gif" type="image/jpeg">
<link rel="author" href="humans.txt" type="text/plain">
<link href="http://thenextweb.com/2009/01/08/how-to-snap-up-that-twitter-username-youve-always-wanted/" rel="original-source">
<link rel="profile" title="Microformats" href="http://microformats.org/profile/specs/">
<link rel="profile" href="http://gmpg.org/xfn/11">
OpenGraph Meta 標簽
<!-- SNS 開放內(nèi)容協(xié)議 (Open Graph Protocol) -->
<meta name="og:title" content="The Rock">
<meta name="og:type" content="movie">
<meta name="og:url" content="http://www.imdb.com/title/tt0117500/">
<meta name="og:image" content="http://ia.media-imdb.com/rock.jpg">
<meta name="og:site_name" content="IMDb">
<meta name="og:description" content="A group of U.S. Marines, under command of...">
<meta name="fb:page_id" content="43929265776">
<meta name="application-name" content="foursquare">
<meta name="og:email" content="me@example.com">
<meta name="og:phone_number" content="650-123-4567">
<meta name="og:fax_number" content="+1-415-123-4567">
<meta name="og:latitude" content="37.416343">
<meta name="og:longitude" content="-122.153013">
<meta name="og:street-address" content="1601 S California Ave">
<meta name="og:locality" content="Palo Alto">
<meta name="og:region" content="CA">
<meta name="og:postal-code" content="94304">
<meta name="og:country-name" content="USA">
<meta property="fb:admins" content="987654321">
<meta property="og:type" content="game.achievement">
<meta property="og:points" content="POINTS_FOR_ACHIEVEMENT">
<meta property="og:video" content="http://example.com/awesome.swf">
<meta property="og:video:height" content="640">
<meta property="og:video:width" content="385">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video" content="http://example.com/html5.mp4">
<meta property="og:video:type" content="video/mp4">
<meta property="og:video" content="http://example.com/fallback.vid">
<meta property="og:video:type" content="text/html">
<meta property="og:audio" content="http://example.com/amazing.mp3">
<meta property="og:audio:title" content="Amazing Song">
<meta property="og:audio:artist" content="Amazing Band">
<meta property="og:audio:album" content="Amazing Album">
<meta property="og:audio:type" content="application/mp3">
Meat:
定義和用法
<meta> 元素可提供有關(guān)頁面的元信息（meta-information），比如針對搜索引擎和更新頻度的描述和關(guān)鍵詞。
<meta> 標簽位于文檔的頭部，不包含任何內(nèi)容。<meta> 標簽的屬性定義了與文檔相關(guān)聯(lián)的名稱/值對。
HTML 與 XHTML 之間的差異
在 HTML 中，<meta> 標簽沒有結(jié)束標簽。
在 XHTML 中，<meta> 標簽必須被正確地關(guān)閉。
提示和注釋：
注釋：<meta> 標簽永遠位于 head 元素內(nèi)部。
注釋：元數(shù)據(jù)總是以名稱/值的形式被成對傳遞的。
以上來源于：https://www.w3school.com.cn/tags/tag_meta.asp