常見meta和link標(biāo)簽

頁面基本設(shè)置

<!-- 頁面描述 -->
<meta name="description" content="頁面描述,控制在150字以內(nèi)" />
<!-- 頁面關(guān)鍵詞 -->
<meta name="keywords" content="關(guān)鍵字列表" />
<!-- 作者信息 -->
<meta name="author" content="basecss, i@basecss.net" />
<!-- 頁面圖標(biāo) -->
<link rel="shortcut icon" type="image/icon" href="icon.ico" />

http 信息設(shè)置

<!-- 內(nèi)容語言 -->
<meta http-equiv="content-language" content="zh-CN" />
<!-- 自動跳轉(zhuǎn) -->
<meta http-equiv="refresh" content="3; URL=http://www.baidu.com" />
<!-- 編碼設(shè)置(可以直接用 charset="utf-8" 代替) -->
<meta http-equiv="content-type" content="UTF-8" />
<!-- 緩存信息 -->
<meta http-equiv="expires" content="GMT 格式時間" />
<!-- 禁止緩存 -->
<meta http-equiv="pragma" content="no-cache" />
<!-- 緩存控制 -->
<meta http-equiv="Cache-control" content="max-age=5" />
  <!-- ******************************
  public: 允許任何人緩存此頁;
  private: 不允許緩存服務(wù)器緩存此頁;
  no-cache: 相應(yīng)不能被緩存;
  no-stroe: 請求相應(yīng)都不能被緩存;
  max-age: 最大生存周期(秒);
  min-fresh: 客戶端愿意接受的最小緩存時長,緩存時間超過該值會要求向服務(wù)器查新;
  max-stale: 接受超過緩存時限但不超過該值的數(shù)據(jù);
  ******************************* -->
<!-- 添加 cookie -->
<meta http-equiv="set-cookie" content="cookieName=cookieValue;expires=GMT 格式時間;path=/" />
<!-- 頁面加載動畫 -->
<meta http-equiv="page-enter" content="blandtrans(duration=0.5)" />
<!-- 頁面退出動畫 -->
<meta http-equiv="page-exit" content="revealtrans(duration=0.5,transtion=1)" />
  <!-- ******************************
  transtion 可以取0-23的整數(shù),分別表示:
  0.盒狀收縮; 1.盒狀展開; 2.圓形收縮; 3.圓形展開; 4.向上擦除;
  5.向下擦除; 6.向左擦除; 7.向右擦除; 8.垂直百葉窗; 9.水平百葉窗;
  10.縱向棋盤; 11.橫向棋盤; 12.溶解; 13.左右向中間收縮; 14.中間向左右展開;
  15.上下向中間收縮; 16.中間向上下展開; 17.階梯向左下; 18.階梯向左上;
  19.階梯向右下; 20.階梯向右上; 21.水平隨機(jī)線; 22.垂直隨機(jī)線; 23.隨機(jī);
  ******************************* -->

搜索引擎相關(guān)設(shè)置

<!-- 設(shè)置搜索引擎抓取間隔 -->
<meta name="visit-after" content="10 days">
<!-- 搜索引擎抓取設(shè)置 -->
<meta name="robots" content="index, follow" />
  <!-- ******************************
  index: 允許搜索引擎抓取此頁;
  noindex: 不允許搜索引擎抓取此頁;
  follow: 允許搜索引擎抓取子頁面;
  nofollow: 允許搜索引擎抓取子頁面;
  none: 等同于 noindex 和 nofollow
  all: 等同于 index 和 follow
  ******************************* -->

移動端開發(fā)

移動開發(fā)基本設(shè)置

<!-- 聲明文檔字符編碼 -->
<meta charset="utf-8">
<!-- IE 兼容性設(shè)置 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" /> <!-- 用最新模式渲染,優(yōu)先使用 chrome -->

<!-- 為移動設(shè)備設(shè)置 viewport -->
<meta name="viewport" content="width=device-width,initial-scale=1, minium-scale=1, user-scalable=no" />
<!-- iOS 移動設(shè)備添加主屏幕標(biāo)題設(shè)置 -->
<meta name="apple-mobile-web-app-title" content="My App" />
<!-- 是否啟用全屏模式 -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<!-- 全屏?xí)r狀態(tài)欄顏色設(shè)置 -->
<meta name="apple-mobile-web-status-bar-style" content="black-translucent" />
<!-- 禁用電話號碼自動識別 -->
<meta name="format-detection" content="telephone=no" />
<!-- 禁用郵箱自動識別 -->
<meta name="format-detection" content="email=no" />
<!-- 添加智能 App 廣告條 Smart App Banner(iOS 6+ Safari), 默認(rèn)禁用 -->
<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL" />

iOS 圖標(biāo)

<!-- 非視網(wǎng)膜 iPhone 低于 iOS 7 -->
<link rel="apple-touch-icon" href="icon57.png" sizes="57x57" />
<!-- 非視網(wǎng)膜 iPad 低于 iOS 7 -->
<link rel="apple-touch-icon" href="icon72.png" sizes="72x72" />
<!-- 非視網(wǎng)膜 iPad iOS 7 -->
<link rel="apple-touch-icon" href="icon76.png" sizes="76x76" />
<!-- 視網(wǎng)膜 iPhone 低于 iOS 7 -->
<link rel="apple-touch-icon" href="icon114.png" sizes="114x114" />
<!-- 視網(wǎng)膜 iPhone iOS 7 -->
<link rel="apple-touch-icon" href="icon120.png" sizes="120x120" />
<!-- 視網(wǎng)膜 iPad 低于 iOS 7 -->
<link rel="apple-touch-icon" href="icon144.png" sizes="144x144" />
<!-- 視網(wǎng)膜 iPad iOS 7 -->
<link rel="apple-touch-icon" href="icon152.png" sizes="152x152" />

iOS啟動畫面

<!-- iPad 豎屏 768 x 1004(標(biāo)準(zhǔn)分辨率) -->
<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(標(biāo)準(zhǔn)分辨率) -->
<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 (標(biāo)準(zhǔn)分辨率) -->
<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" />

其他常見設(shè)置

<!-- Windows 8 磁貼顏色 -->
<meta name="msapplication-TileColor" content="#000"/>
<!-- Windows 8 磁貼圖標(biāo) -->
<meta name="msapplication-TileImage" content="icon.png"/>
<!-- Android 啟動圖標(biāo) -->
<link rel="shortcut icon" sizes="128x128" href="icon.png" />
<!-- 添加 RSS 訂閱 -->
<link rel="alternate" type="application/rss+xml" title="RSS" href="/rss.xml" />
<!-- 添加 favicon icon -->
<link rel="shortcut icon" type="image/ico" href="/favicon.ico" />
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,366評論 25 708
  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 15,835評論 4 61
  • WebSocket-Swift Starscream的使用 WebSocket 是 HTML5 一種新的協(xié)議。它實(shí)...
    香橙柚子閱讀 24,844評論 8 183
  • 追求100%的安全感無疑是浪費(fèi)表情浪費(fèi)時間的。理清每個看上去相似的概念,哪怕是一點(diǎn)點(diǎn)的不同,都可能會影響到我們的一...
    A00小淺閱讀 222評論 0 0

友情鏈接更多精彩內(nèi)容