mate
標(biāo)簽提供關(guān)于HTML文檔的元數(shù)據(jù)。元數(shù)據(jù)不會(huì)顯示在頁(yè)面上，但是對(duì)于機(jī)器是可讀的。它可用于瀏覽器（如何顯示內(nèi)容或重新加載頁(yè)面），搜索引擎(關(guān)鍵詞)
mate屬性
- name
name 屬性提供了名稱/值對(duì)中的名稱。HTML 和 XHTML 標(biāo)簽都沒(méi)有指定任何預(yù)先定義的 <meta> 名稱。通常情況下，您可以自由使用對(duì)自己和源文檔的讀者來(lái)說(shuō)富有意義的名稱。
- http-equiv
http-equiv 屬性為名稱/值對(duì)提供了名稱。并指示服務(wù)器在發(fā)送實(shí)際的文檔之前先在要傳送給瀏覽器的 MIME 文檔頭部包含名稱/值對(duì)。 - content
content 屬性提供了名稱/值對(duì)中的值(name, http-equiv)。該值可以是任何有效的字符串。
content 屬性始終要和 name 屬性或 http-equiv 屬性一起使用。
設(shè)定網(wǎng)頁(yè)字符集
<meta http-equiv="content-Type" content="text/html;charset=utf-8">
<meta charset="utf-8">
關(guān)鍵字
<meta name="keywords" content="your,keywords">
響應(yīng)式
<meta name="viewport" content="width=device-width, initial-scale=1">
- viewport：能優(yōu)化移動(dòng)瀏覽器的顯示。如果不是響應(yīng)式網(wǎng)站，不要使用initial-scale或者禁用縮放。
- width：寬度（數(shù)值 / device-width）（范圍從200 到10,000，默認(rèn)為980 像素）
- height：高度（數(shù)值 / device-height）（范圍從223 到10,000）
- initial-scale：初始的縮放比例 （范圍從>0 到10）
- minimum-scale：允許用戶縮放到的最小比例
- maximum-scale：允許用戶縮放到的最大比例
- user-scalable：用戶是否可以手動(dòng)縮 (no,yes)
- minimal-ui：可以在頁(yè)面加載時(shí)最小化上下?tīng)顟B(tài)欄。（已棄用）
- 注意，很多人使用initial-scale=1到非響應(yīng)式網(wǎng)站上，這會(huì)讓網(wǎng)站以100%寬度渲染，
- 用戶需要手動(dòng)移動(dòng)頁(yè)面或者縮放。如果和initial-scale=1同時(shí)使用user-scalable=no或maximum-scale=1，
- 則用戶將不能放大/縮小網(wǎng)頁(yè)來(lái)看到全部的內(nèi)容。
移動(dòng)設(shè)備相關(guān)(中國(guó))
- <meta name="HandheldFriendly" content="true">
- <meta name="MobileOptimized" content="320">
- <meta name="screen-orientation" content="portrait">
- <meta name="x5-orientation" content="portrait">
- <meta name="full-screen" content="yes">
- <meta name="x5-fullscreen" content="true">
- <meta name="browsermode" content="application">
- <meta name="x5-page-mode" content="app">
Apple ios
- <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="format-detection" content="email=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="App Title">
- <link rel="apple-touch-icon" href="apple-touch-icon.png">
- <link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">
Google android
<meta name="theme-color" content="#E64545">
<meta name="mobile-web-app-capable" content="yes">
