常見的meta標(biāo)簽及詳細(xì)解說

常見的meta標(biāo)簽

定義和用法:

<meta> 元素可提供有關(guān)頁面的元信息(meta-information)维雇,比如針對搜索引擎和更新頻度的描述和關(guān)鍵詞肥橙。
meta 標(biāo)簽位于文檔的頭部栽燕,不包含任何內(nèi)容暂氯。<meta> 標(biāo)簽的屬性定義了與文檔相關(guān)聯(lián)的名稱/值對潮模。
在 HTML 中,<meta> 標(biāo)簽沒有結(jié)束標(biāo)簽痴施。
在 XHTML 中擎厢,<meta> 標(biāo)簽必須被正確地關(guān)閉。
注釋:<meta> 標(biāo)簽永遠(yuǎn)位于 head 元素內(nèi)部晾剖。
注釋:元數(shù)據(jù)總是以名稱/值的形式被成對傳遞的。

meta標(biāo)簽中必需的屬性:

屬性:content
值:some_text
描述:定義與 http-equiv 或 name 屬性相關(guān)的元信息
注意:content 屬性始終要和 name 屬性或 http-equiv 屬性一起使用梯嗽。
meta標(biāo)簽中可用的屬性:

屬性:http-equiv
值:content-type齿尽,expires,refresh灯节,set-cookie
描述:把 content 屬性關(guān)聯(lián)到 HTTP 頭部循头。
例如:

<meta http-equiv="charset" content="iso-8859-1">

屬性:name

值:author,description炎疆,keywords卡骂,generator,revised形入,others
描述:把 content 屬性關(guān)聯(lián)到一個名稱全跨。
例如:

<meta name="keywords" content="HTML,ASP,PHP,SQL">

屬性:scheme

值:some_text
描述:定義用于翻譯 content 屬性值的格式。
例如:

<meta scheme="dreamdu tutorial" name="url" content="http://www.dreamdu.com">

meta標(biāo)簽的name屬性語法格式是:

<meta name="參數(shù)"content="具體的參數(shù)值">亿遂。 

其中name屬性主要有以下幾種參數(shù):

Keywords(關(guān)鍵字)

說明:keywords用來告訴搜索引擎你網(wǎng)頁的關(guān)鍵字是什么浓若。

舉例:

<meta name="keywords"content="meta總結(jié),html meta,meta屬性,meta跳轉(zhuǎn)"> 

description(網(wǎng)站內(nèi)容描述)

說明:description用來告訴搜索引擎你的網(wǎng)站主要內(nèi)容渺杉。

舉例:

<meta name="description"content="haorooms博客,html的meta總結(jié),meta是html語言head區(qū)的一個輔助性標(biāo)簽挪钓。"> 

robots(機(jī)器人向?qū)?

說明:robots用來告訴搜索機(jī)器人哪些頁面需要索引是越,哪些頁面不需要索引。

content的參數(shù)有all,none,index,noindex,follow,nofollow碌上。默認(rèn)是all倚评。

舉例:

<meta name="robots"content="none"> 

具體參數(shù)如下:

信息參數(shù)為all:文件將被檢索,且頁面上的鏈接可以被查詢馏予;

信息參數(shù)為none:文件將不被檢索天梧,且頁面上的鏈接不可以被查詢;

信息參數(shù)為index:文件將被檢索吗蚌;

信息參數(shù)為follow:頁面上的鏈接可以被查詢腿倚;

信息參數(shù)為noindex:文件將不被檢索,但頁面上的鏈接可以被查詢蚯妇;

信息參數(shù)為nofollow:文件將被檢索敷燎,但頁面上的鏈接不可以被查

author(作者)

說明:標(biāo)注網(wǎng)頁的作者

舉例:

<meta name="author"content="root,root@xxxx.com"> 

generator

<meta name="generator"content="信息參數(shù)"/> 

meta標(biāo)簽的generator的信息參數(shù),代表說明網(wǎng)站的采用的什么軟件制作箩言。

COPYRIGHT

<META NAME="COPYRIGHT"CONTENT="信息參數(shù)"> 

meta標(biāo)簽的COPYRIGHT的信息參數(shù)硬贯,代表說明網(wǎng)站版權(quán)信息。

revisit-after

<META name="revisit-after"CONTENT="7days"> 

revisit-after代表網(wǎng)站重訪,7days代表7天陨收,依此類推饭豹。

Viewport

說明:設(shè)置頁面縮放比例

<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1″>

width:控制 viewport 的大小,可以指定的一個值务漩,如果 600拄衰,或者特殊的值,如 device-width 為設(shè)備的寬度(單位為縮放為 100% 時的 CSS 的像素)饵骨。
height:和 width 相對應(yīng)翘悉,指定高度。
initial-scale:初始縮放比例居触,也即是當(dāng)頁面第一次 load 的時候縮放比例妖混。
maximum-scale:允許用戶縮放到的最大比例。
minimum-scale:允許用戶縮放到的最小比例轮洋。
user-scalable:用戶是否可以手動縮放

http-equiv屬性

http-equiv顧名思義制市,相當(dāng)于http的文件頭作用,它可以向瀏覽器傳回一些有用的信息弊予,以幫助正確和精確地顯示網(wǎng)頁內(nèi)容祥楣,與之對應(yīng)的屬性值為content,content中的內(nèi)容其實就是各個參數(shù)的變量值。

meta標(biāo)簽的http-equiv屬性語法格式是:

<meta http-equiv="參數(shù)"content="參數(shù)變量值">荣堰; 

其中http-equiv屬性主要有以下幾種參數(shù):

1床未、Expires(期限)

說明:可以用于設(shè)定網(wǎng)頁的到期時間。一旦網(wǎng)頁過期振坚,必須到服務(wù)器上重新傳輸薇搁。

用法:

<meta http-equiv="expires"content="Fri,12Jan200118:18:18GMT"> 

注意:必須使用GMT的時間格式。

2渡八、Pragma(cache模式)

說明:禁止瀏覽器從本地計算機(jī)的緩存中訪問頁面內(nèi)容啃洋。

用法:

<meta http-equiv="Pragma"content="no-cache"> 

注意:這樣設(shè)定,訪問者將無法脫機(jī)瀏覽屎鳍。

3宏娄、Refresh(刷新)

說明:自動刷新并指向新頁面。

用法:

<meta http-equiv="Refresh"content="2;URL=http://www.haorooms.com"> //(注意后面的引號逮壁,分別在秒數(shù)的前面和網(wǎng)址的后面) 

注意:其中的2是指停留2秒鐘后自動刷新到URL網(wǎng)址孵坚。

4、Set-Cookie(cookie設(shè)定)

說明:如果網(wǎng)頁過期窥淆,那么存盤的cookie將被刪除卖宠。

用法:

<meta http-equiv="Set-Cookie"content="cookie value=xxx;expires=Friday,12-Jan-200118:18:18GMT;path=/"> 

注意:必須使用GMT的時間格式忧饭。

5扛伍、Window-target(顯示窗口的設(shè)定)

說明:強制頁面在當(dāng)前窗口以獨立頁面顯示。

用法:

<meta http-equiv="Window-target"content="_top"> 

注意:用來防止別人在框架里調(diào)用自己的頁面词裤。

6刺洒、content-Type(顯示字符集的設(shè)定)

說明:設(shè)定頁面使用的字符集。

用法:

<meta http-equiv="content-Type"content="text/html;charset=gb2312"> 

具體如下:

meta標(biāo)簽的charset的信息參數(shù)如GB2312時吼砂,代表說明網(wǎng)站是采用的編碼是簡體中文逆航;

meta標(biāo)簽的charset的信息參數(shù)如BIG5時,代表說明網(wǎng)站是采用的編碼是繁體中文渔肩;

meta標(biāo)簽的charset的信息參數(shù)如iso-2022-jp時因俐,代表說明網(wǎng)站是采用的編碼是日文;

meta標(biāo)簽的charset的信息參數(shù)如ks_c_5601時赖瞒,代表說明網(wǎng)站是采用的編碼是韓文女揭;

meta標(biāo)簽的charset的信息參數(shù)如ISO-8859-1時蚤假,代表說明網(wǎng)站是采用的編碼是英文栏饮;

meta標(biāo)簽的charset的信息參數(shù)如UTF-8時,代表世界通用的語言編碼磷仰;

7袍嬉、content-Language(顯示語言的設(shè)定)

用法:

<meta http-equiv="Content-Language"content="zh-cn"/> 

8、Cache-Control指定請求和響應(yīng)遵循的緩存機(jī)制。

Cache-Control指定請求和響應(yīng)遵循的緩存機(jī)制伺通。在請求消息或響應(yīng)消息中設(shè)置Cache-Control并不會修改另一個消息處理過程中的緩存處理過程箍土。請求時的緩存指令包括no-cache、no-store罐监、max-age吴藻、max-stale、min-fresh弓柱、on

ly-if-cached沟堡,響應(yīng)消息中的指令包括public、private矢空、no-cache航罗、no-store、no-transform屁药、must-revalidate粥血、proxy-revalidate、max-age酿箭。各個消息中的指令含義如下

Public指示響應(yīng)可被任何緩存區(qū)緩存

Private指示對于單個用戶的整個或部分響應(yīng)消息复亏,不能被共享緩存處理。這允許服務(wù)器僅僅描述當(dāng)用戶的部分響應(yīng)消息七问,此響應(yīng)消息對于其他用戶的請求無效

no-cache指示請求或響應(yīng)消息不能緩存

no-store用于防止重要的信息被無意的發(fā)布蜓耻。在請求消息中發(fā)送將使得請求和響應(yīng)消息都不使用緩存。

max-age指示客戶機(jī)可以接收生存期不大于指定時間(以秒為單位)的響應(yīng)

min-fresh指示客戶機(jī)可以接收響應(yīng)時間小于當(dāng)前時間加上指定時間的響應(yīng)

max-stale指示客戶機(jī)可以接收超出超時期間的響應(yīng)消息械巡。如果指定max-stale消息的值刹淌,那么客戶機(jī)可以接收超出超時期指定值之內(nèi)的響應(yīng)消息。

9讥耗、http-equiv="imagetoolbar"

<meta http-equiv="imagetoolbar"content="false"/> 

指定是否顯示圖片工具欄有勾,當(dāng)為false代表不顯示,當(dāng)為true代表顯示古程。

10蔼卡、Content-Script-Type

<Meta http-equiv="Content-Script-Type"Content="text/javascript">
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市挣磨,隨后出現(xiàn)的幾起案子雇逞,更是在濱河造成了極大的恐慌,老刑警劉巖茁裙,帶你破解...
    沈念sama閱讀 211,884評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件塘砸,死亡現(xiàn)場離奇詭異,居然都是意外死亡晤锥,警方通過查閱死者的電腦和手機(jī)掉蔬,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,347評論 3 385
  • 文/潘曉璐 我一進(jìn)店門廊宪,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人女轿,你說我怎么就攤上這事箭启。” “怎么了蛉迹?”我有些...
    開封第一講書人閱讀 157,435評論 0 348
  • 文/不壞的土叔 我叫張陵傅寡,是天一觀的道長。 經(jīng)常有香客問我北救,道長赏僧,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,509評論 1 284
  • 正文 為了忘掉前任扭倾,我火速辦了婚禮淀零,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘膛壹。我一直安慰自己驾中,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 65,611評論 6 386
  • 文/花漫 我一把揭開白布模聋。 她就那樣靜靜地躺著肩民,像睡著了一般。 火紅的嫁衣襯著肌膚如雪链方。 梳的紋絲不亂的頭發(fā)上持痰,一...
    開封第一講書人閱讀 49,837評論 1 290
  • 那天,我揣著相機(jī)與錄音祟蚀,去河邊找鬼工窍。 笑死,一個胖子當(dāng)著我的面吹牛前酿,可吹牛的內(nèi)容都是我干的患雏。 我是一名探鬼主播,決...
    沈念sama閱讀 38,987評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼罢维,長吁一口氣:“原來是場噩夢啊……” “哼淹仑!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起肺孵,我...
    開封第一講書人閱讀 37,730評論 0 267
  • 序言:老撾萬榮一對情侶失蹤匀借,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后平窘,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體吓肋,經(jīng)...
    沈念sama閱讀 44,194評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,525評論 2 327
  • 正文 我和宋清朗相戀三年初婆,在試婚紗的時候發(fā)現(xiàn)自己被綠了蓬坡。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,664評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡磅叛,死狀恐怖屑咳,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情弊琴,我是刑警寧澤兆龙,帶...
    沈念sama閱讀 34,334評論 4 330
  • 正文 年R本政府宣布,位于F島的核電站敲董,受9級特大地震影響紫皇,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜腋寨,卻給世界環(huán)境...
    茶點故事閱讀 39,944評論 3 313
  • 文/蒙蒙 一聪铺、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧萄窜,春花似錦铃剔、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,764評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至穗泵,卻和暖如春普气,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背佃延。 一陣腳步聲響...
    開封第一講書人閱讀 31,997評論 1 266
  • 我被黑心中介騙來泰國打工现诀, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人履肃。 一個月前我還...
    沈念sama閱讀 46,389評論 2 360
  • 正文 我出身青樓赶盔,卻偏偏與公主長得像,于是被迫代替她去往敵國和親榆浓。 傳聞我的和親對象是個殘疾皇子于未,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,554評論 2 349

推薦閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn)陡鹃,斷路器烘浦,智...
    卡卡羅2017閱讀 134,633評論 18 139
  • meta是html語言head區(qū)的一個輔助性標(biāo)簽。也許你認(rèn)為這些代碼可有可無萍鲸。其實如果你能夠用好meta標(biāo)簽闷叉,會給...
    才気莮孒閱讀 1,012評論 0 2
  • 前言 meta是html語言head區(qū)的一個輔助性標(biāo)簽握侧。也許你認(rèn)為這些代碼可有可無蚯瞧。其實如果你能夠用好meta標(biāo)簽...
    Ymuyi閱讀 1,425評論 4 29
  • 原文鏈接:http://caibaojian.com/mobile-meta.html 上面給出了常用的一些met...
    butterflyq閱讀 370評論 0 1
  • 引子 下面具體介紹一下meta的功能和使用。 前言 meta是html語言head區(qū)的一個輔助性標(biāo)簽品擎。也許你認(rèn)為這...
    隨風(fēng)化作雨閱讀 243評論 0 0