相信你已經多少見過html的meta標籤，但是對它的認識可能還不夠全面，那麼我簡單爲大家整理了下meta標籤全部的屬性值以及說明。
屬性
meta爲標籤head中的子標籤，包括content（必選，存儲值）、name（鍵名）、http-equiv（鍵名）、scheme(content格式)四個屬性。
其中content屬性爲標記的具體值，必填值；name爲把值關聯到某個名稱，http-equiv是把值關聯到http頭部；scheme是規定了content 的文本格式。
http-equiv
1、Content-Type 文檔類型,對應值爲 text-html;charset=utf-8 ;
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
1
2、Cache-Control 緩存控制，常見的取值有private、no-cache、max-age、must-revalidate等，默認爲private,
1） 打開新窗口 值爲private、no-cache、must-revalidate，那麼打開新窗口訪問時都會重新訪問服務器。 而如果指定了max-age值，那麼在此值內的時間裏就不會重新訪問服務器，例如： Cache-control: max-age=5(表示當訪問此網頁後的5秒內再次訪問不會去服務器)
2） 在地址欄回車 值爲private或must-revalidate則只有第一次訪問時會訪問服務器，以後就不再訪問。 值爲no-cache，那麼每次都會訪問。 值爲max-age，則在過期之前不會重複訪問。
3） 按後退按扭 值爲private、must-revalidate、max-age，則不會重訪問， 值爲no-cache，則每次都重複訪問
4） 按刷新按扭 無論爲何值，都會重複訪問 Cache-control值爲“no-cache”時，訪問此頁面不會在Internet臨時文件夾留下頁面備份。
<meta http-equiv="Cache-Control" content="no-cache"/>
3、refresh 刷新頁面,取值 5;URL=http://www.baidu.com,前面爲跳轉的時間（單位s），頁面可以爲絕對地址也可以爲相對頁面地址，頁面地址不寫默認爲刷新當前頁面。
<meta http-equiv="refresh" content="5;URL=http://www.baidu.com"/>
4 、X-UA-Compatible 設置ie瀏覽器的文檔的渲染模式，IE=edge,chrome=1.說明 ：這個參數用於解決瀏覽器的兼容性一致外觀問題，可以使ie不同版本的瀏覽器有一致的外觀，如果是edge則是以最新的模式渲染，如果有谷歌按照谷歌渲染。也可以強制按照ie7 8的標準渲染，如IE=7;IE=9
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
1
5、其他（不常用的不再說明）
expires:網頁的有效期，超過這個時間，網頁作廢，很少用,Sunday 26 October 2008 01:00 GMT；
<meta http-equiv="expires" content="Sunday 26 October 2008 01:00 GMT" /> content-language:網頁的編碼,語言類型,zh,en等，語言類型地址：點擊查看
<meta http-equiv="content-language" content="zh-CN" /> Pragma 控制禁止從緩存中訪問頁面
<meta http-equiv="Pragma" content="no-cache">
name
用於定義一些關鍵屬性，用處很多。
1、keyword 關鍵字 ，用戶描述網站的主題
`<meta name="keywords" content="your tags" />`
1
2、description 網站描述，每個網頁都應有一個不超過 150 個字符且能準確反映網頁內容的描述標籤
`<meta name="description" content="150 words" />`
3、
robots 搜索方式，常見值
all：文件將被檢索，且頁面上的鏈接可以被查詢；
none：文件將不被檢索，且頁面上的鏈接不可以被查詢；
index：文件將被檢索；
follow：頁面上的鏈接可以被查詢；
noindex：文件將不被檢索，但頁面上的鏈接可以被查詢；
nofollow：文件將不被檢索，頁面上的鏈接可以被查詢。
`<meta name="robots" content="index,follow" />`
4、viewport 針對移動設備，控制視圖的寬高，width爲頁面內容的寬度，initial-scale代表初始方法倍數，maximum-scale代表最大放大倍數，minimum-scale=0.5代表最小放大倍數，height：高度（數值 / device-height）（範圍從223 到10,000），user-scalable：用戶是否可以手動縮 (no,yes)，而爲了更好的使用這個scale參數，需要獲取當前的縮放倍率，用設備的寬度縮放640設計稿的比率
<meta name="viewport" content="width=device-width; initial-scale=1.0;maximum-scale=1.0; user-scalable=no;"/>
5、format-detection 忽略識別一些特殊內容，如郵箱，電話等，寫在一起可能會失效
<meta content="telephone=no" name="format-detection" />
6、apple-mobile-web-app-capable 蘋果默認的菜單欄，工具欄
<meta name=”apple-mobile-web-app-capable” content=”yes” />
7、其他
<!-- 針對手持設備優化，主要是針對一些老的不識別viewport的瀏覽器，比如黑莓 -->
<meta name="HandheldFriendly" content="true">
<!-- 只有在開啓WebApp全屏模式時才生效。content的值爲default | black | black-translucent 。 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<!-- 微軟的老式瀏覽器 -->
<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應用模式 -->
<meta name="browsermode" content="application">
<!-- QQ應用模式 -->
<meta name="x5-page-mode" content="app">
<!-- windows phone 點擊無高光 -->
<meta name="msapplication-tap-highlight" content="no">