1. meta 標(biāo)簽的使用和總結(jié):
1. <meta> 元素可提供有關(guān)頁(yè)面的 元信息(meta-information), 比如針對(duì) 搜索引擎 和 更新頻度 的描述和關(guān)鍵詞 。
2. <meta> 標(biāo)簽位于文檔的頭部, 不包含任何內(nèi)容 。`
3. <meta> 標(biāo)簽的屬性定義了與文檔相關(guān)聯(lián)的 名稱/值對(duì)
1. 聲明文檔使用的 字符編碼
1. <meta charset='utf-8'>
2. 頁(yè)面描述
1. <meta name="description" content="不超過(guò)150個(gè)字符"/>
3. 定義關(guān)鍵詞
1. <meta name="Keywords" content="120字內(nèi)" />
4. 預(yù)解析:
1. <meta http-equiv="x-dns-prefetch-control" content="on" />
5. 為移動(dòng)設(shè)備添加 viewport
1. <meta name="viewport" content="initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no">
2. (`width=device-width` 會(huì)導(dǎo)致 iPhone 5 添加到主屏后以 WebApp 全屏模式打開(kāi)頁(yè)面時(shí)出現(xiàn)黑邊 http://bigc.at/ios-webapp-viewport-meta.orz )
6. 是否啟用 WebApp 全屏模式, 刪除蘋(píng)果默認(rèn)的工具欄和菜單欄
1. <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
7. uc 強(qiáng)制豎屏
1. <meta name="full-screen" content="yes">
8. refresh (自動(dòng)刷新并指向某頁(yè)面)
1. <meta http-equiv="refresh" content="2; URL=http://www.lxxyx.win/">;
// 意思是2秒后跳轉(zhuǎn)向我的博客
9. Set-Cookie(cookie 設(shè)定)
1. // 說(shuō)明: 如果網(wǎng)頁(yè)過(guò)期 。 那么這個(gè)網(wǎng)頁(yè)存在本地的 cookies 也會(huì)被自動(dòng)刪除 。
2. <meta http-equiv="Set-Cookie" content="name, date"> //格式
3. <meta http-equiv="Set-Cookie" content="User=Lxxyx; path=/; expires=Sunday, 10-Jan-16 10:00:00 GMT">
10. 禁止百度自動(dòng)轉(zhuǎn)碼
1. 說(shuō)明: 用于禁止當(dāng)前頁(yè)面在移動(dòng)端瀏覽時(shí), 被百度自動(dòng)轉(zhuǎn)碼 。 雖然百度的本意是好的, 但是轉(zhuǎn)碼效果很多時(shí)候卻不盡人意 。 所以可以在 head 中加入例子中的那句話, 就可以避免百度自動(dòng)轉(zhuǎn)碼了 。
2. <meta http-equiv="Cache-Control" content="no-siteapp" />
11. 避免 IE 使用兼容模式
1. <meta http-equiv="X-UA-Compatible" content="IE=edge">
12. X-UA-Compatible(瀏覽器采取何種版本渲染當(dāng)前頁(yè)面 / 優(yōu)先使用 IE 最新版本 和 Chrome)
1. 說(shuō)明: 用于告知瀏覽器以何種版本來(lái)渲染頁(yè)面 。 (一般都設(shè)置為最新模式, 在各大框架中這個(gè)設(shè)置也很常見(jiàn)。)
2. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
13. expires(網(wǎng)頁(yè)到期時(shí)間)
1. 說(shuō)明: 用于設(shè)定網(wǎng)頁(yè)的到期時(shí)間, 過(guò)期后網(wǎng)頁(yè)必須到服務(wù)器上重新傳輸 。
2. <meta http-equiv="expires" content="Sunday 26 October 2016 01:00 GMT" />
14. cache-control(指定請(qǐng)求和響應(yīng)遵循的緩存機(jī)制)
1. 瀏覽器如何緩存某個(gè)響應(yīng)以及緩存多長(zhǎng)時(shí)間。
2. <meta http-equiv="cache-control" content="no-cache">
3. no-cache: 先發(fā)送請(qǐng)求, 與服務(wù)器確認(rèn)該資源是否被更改, 如果未被更改, 則使用緩存。
4. no-store: 不允許緩存, 每次都要去服務(wù)器上, 下載完整的響應(yīng)。（安全措施）
5. public : 緩存所有響應(yīng), 但并非必須 。 因?yàn)?max-age 也可以做到相同效果
6. private : 只為單個(gè)用戶緩存, 因此不允許任何中繼進(jìn)行緩存。（比如說(shuō)CDN就不允許緩存 private 的響應(yīng)）
7. max-age : 表示當(dāng)前請(qǐng)求開(kāi)始, 該響應(yīng)在多久內(nèi)能被緩存和重用, 而不去服務(wù)器重新請(qǐng)求 。 例如: max-age=60 表示響應(yīng)可以再緩存和重用 60 秒。
15. 雙核瀏覽器優(yōu)先使用 webkit 內(nèi)核
1. <meta name="renderer" content="webkit">
第一次發(fā)表文章, 有不足之處希望大家指出(修訂版)。這篇文章主要講述 meta 標(biāo)簽的使用方式， 沒(méi)有具體的屬性講解， 有的只是具體的使用方式以及使用 meta 標(biāo)簽帶來(lái)的用途 (如需轉(zhuǎn)載，請(qǐng)注明出處) 。
