自學前端開始，我對meta標簽接觸不多，主要把精力都集中在能顯示出來的標簽上，比如span、button、h1等等。有時候去查看一些知名網站的源碼，發現head標簽里有一大摞的meta。

今天就來學習一下meta的用處，看看有些啥屬性。

一、定義及作用

meta，即元數據（Metadata）是數據的數據信息。

該標簽提供了 HTML 文檔的元數據。元數據不會顯示在客戶端，但是會被瀏覽器解析。

通常用于指定網頁的描述，關鍵詞，文件的最后修改時間，作者及其他元數據。

元數據可以被使用瀏覽器（如何顯示內容或重新加載頁面），搜索引擎（關鍵詞），或其他 Web 服務調用。

二、屬性

1、charset

HTML5新增的屬性，定義當前頁面的字符編碼

新寫法：

 meta charset= UTF-8 

老寫法：

 meta http-equiv= Content-Type content= text/html; charset=UTF-8 

HTML5中優先用新寫法

2、name屬性

a、keywords，當前網頁的關鍵字，便于搜索引擎識別，提高搜索準確性

 meta name= keywords content= cdn，網絡加速，運營商 

b、description，對當前網頁的簡單描述，如果用百度搜索的話，在搜索結果的每個標題下面會顯示description的內容，方便用戶快速定位

 meta name= description content= 本公司專注提供CDN網絡加速，同時也提供云計算服務 

c、viewport，這個meta有點復雜，主要用在移動網頁中，需要單獨寫一篇文章，這里暫時略過

 meta name= viewport content= width=device-width, initial-scale=1.0, maximum-scale=1.0 / 

d、robots，搜索引擎爬蟲的索引方式

 meta name= robots content= none 

content的取值有all、none、index、noindex、follow、nofollow，默認是all，具體的說明如表格所示：

e、author，文檔的作者

 meta name= author content= liuhw，liuhuansir@126.com 

f、copyright，文檔的版權說明

 meta name= copyright content= liuhw 

g、revisit-after，搜索引擎爬蟲重訪的時間間隔，如果你的網站不經常更新，那可以把這個時間設置的稍長一些，能略微的減輕服務器的壓力，節省帶寬資源

 meta name= revisit-after content= 5 days 

h、renderer，雙核瀏覽器的渲染方式，指定默認用哪個瀏覽器內核來渲染，例如360瀏覽器：

 meta name= renderer content= webkit //默認webkit內核 meta name= renderer content= ie-comp //默認IE兼容模式 meta name= renderer content= ie-stand //默認IE標準模式

3、http-equiv

模擬http里的頭，回傳給服務器一些信息

a、expires，網頁的到期時間，過期之后，需要重新訪問服務器

 meta http-equiv= expires content= Sunday 26 October 2018 01:00 GMT / 

b、pragma(兼容http1.0，1.1)，cache-control(http1.1新增)，設置緩存方式，建議用cache-control，該屬性的content具體參考http里的cache-control

 meta http-equiv= cache-control content= no-cache 

c、refresh，自動刷新并跳轉到content中聲明的url

 meta http-equiv= refresh content= 5；URL=http://www.liuhw.club/ //5秒后跳轉向我自己的域名

d、set-cookie，添加cookie

 meta http-equiv= set-cookie content= TOKEN_KEY=81BBF72619795017B6AC214AE705F1F8; Domain=10.1.100.111; Path=/ 

e、content-Type，文檔的字符編碼，同charset，建議使用charset

 meta http-equiv= content-type content= text/html;charset=gb2312 

f、x-ua-compatible，告訴瀏覽器用哪個版本來渲染文檔

 meta http-equiv= x-ua-compatible content= IE=edge,chrome=1 / //指定IE和Chrome使用最新版本渲染當前頁面

總結一下，上面只是列出了一些常用的屬性，沒有列出來的等需要用到的時候再查文檔

【相關推薦：HTML5視頻教程】

以上就是html meta標簽使用及屬性的詳細分析的詳細內容，其它編程語言

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。