HTML 中常用的 meta 元素

meta標(biāo)簽提供了 HTML 文檔的元數(shù)據(jù)。元數(shù)據(jù)不會顯示在客戶端,但是會被瀏覽器解析诚隙。META元素通常用于指定網(wǎng)頁的描述隐解,關(guān)鍵詞,文件的最后修改時間升酣,作者及其他元數(shù)據(jù)舷暮。元數(shù)據(jù)可以被使用瀏覽器(如何顯示內(nèi)容或重新加載頁面),搜索引擎(關(guān)鍵詞)噩茄,或其他 Web 服務(wù)調(diào)用脚牍。

meta 的屬性有:name屬性、http-equiv屬性 巢墅、content屬性和charset屬性 诸狭。

name屬性:

name 屬性規(guī)定元數(shù)據(jù)的名稱。

name 屬性規(guī)定content屬性的信息/值的名稱君纫。

注意:如果設(shè)置了 http-equiv 屬性驯遇,則不應(yīng)該設(shè)置 name 屬性。

語法

<meta name="value">

屬性值

application-name 規(guī)定頁面所代表的 Web 應(yīng)用程序的名稱蓄髓。

author 規(guī)定文檔的作者的名字叉庐。

<meta name = "author" content = "作者的姓名">

description 規(guī)定頁面的描述。搜索引擎會把這個描述顯示在搜索結(jié)果中会喝。

<meta name = "description" content = "對頁面的描述語言”>

generator 規(guī)定用于生成文檔的一個軟件包(不用于手寫頁面)陡叠。

<meta name = "generator" content = "編輯軟件的名稱">

keywords 規(guī)定一個逗號分隔的關(guān)鍵詞列表 - 相關(guān)的網(wǎng)頁(告訴搜索引擎頁面是與什么相關(guān)的)。

提示:總是規(guī)定關(guān)鍵詞(對于搜索引擎進(jìn)行頁面分類是必要的)肢执。

<meta name = "keywords" content = "具體的關(guān)鍵字">

referrer 控制所述HTTP的內(nèi)容Referer附加到從本文件發(fā)送的任何請求的HTTP標(biāo)頭枉阵。

<meta name="referrer">
no-referrer 不要發(fā)送一個HTTP Referer標(biāo)頭。
origin 發(fā)送起源的文件预茄。
no-referrer-when-downgrade 發(fā)送原點(diǎn)作為引薦先驗(yàn)的兴溜,多的安全目的地(https-> HTTPS),但不發(fā)送引薦一個不太安全的目的地(https-> HTTP)。這是默認(rèn)的行為拙徽。
origin-when-crossorigin 執(zhí)行相同來源的請求時刨沦,發(fā)送一個完整的URL(從參數(shù)剝離),但只送起源的其他情況下的文件膘怕。
unsafe-URL perfoming來源相同的請求時想诅,發(fā)送一個完整的URL(從參數(shù)剝離)。

creator 限定岛心,在自由格式中侧蘸,文件的創(chuàng)建者的名稱。請注意鹉梨,它可以是機(jī)構(gòu)的名稱讳癌。如果有不止一個,有幾個要素都應(yīng)該使用存皂。

googlebot 這是一個代名詞robots晌坤,但只有其是googlebot,索引爬蟲對谷歌搜索旦袋。

publisher 在一個自由的格式骤菠,文件的發(fā)布者的名稱。請注意疤孕,它可以是該機(jī)構(gòu)的名稱商乎。

robots(定義搜索 引擎爬蟲的索引方式):content的參數(shù)有all(默認(rèn) ),none,index,follow,nofollow。

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

slurp 這是一個代名詞robots祭阀,但只有其是slurp鹉戚,索引爬蟲對雅虎搜索。

viewport 這給出了關(guān)于的初始大小的大小提示視口专控。

<meta name="viewport" content="width=device-width, initial-scale=1.0">
可能值 描述
width 一個正整數(shù)或者字符串 device-width 限定了寬度抹凳,以像素為單位,視口的
height 一個正整數(shù)或者字符串 device-height 定義了高度伦腐,以像素赢底,視口的
initial-scale 一個0.0 到10.0之間的正數(shù) 定義設(shè)備寬度(之間的比率device-width以縱向模式或device-height橫向模式)和視口的大小。
maximum-scale 一個0.0 到10.0之間的正數(shù) 定義了變焦的最大值; 它必須大于或等于minimum-scale或行為是不確定的柏蘑。
minimum-scale 一個0.0 到10.0之間的正數(shù) 定義了變焦的最低值; 它必須小于或等于maximum-scale或行為是不確定的幸冻。
user-scalable 一個布爾值(yes 或者no) 如果設(shè)置為no,用戶無法在網(wǎng)頁中放大咳焚。默認(rèn)值是yes洽损。

scheme 該屬性定義了描述元數(shù)據(jù)的方案。scheme是一種上下文黔攒,它可以對內(nèi)容值進(jìn)行正確的解釋趁啸,就像一種格式。

http-equiv屬性:

http-equiv 屬性提供了content屬性的信息/值的 HTTP 頭督惰。

http-equiv 屬性可用于模擬一個 HTTP 響應(yīng)頭不傅。

語法

<meta http-equiv="content-type|default-style|refresh">

屬性值

content-type 規(guī)定文檔的字符編碼。

<meta http-equiv="content-type" content="text/html; charset=utf-8">

default-style 規(guī)定要使用的預(yù)定義的樣式表赏胚。

<meta http-equiv="default-style" content="the document's preferred stylesheet">

注釋:上面 content 屬性的值必須匹配同一文檔中的一個 link 元素上的 title 屬性的值访娶,或者必須匹配同一文檔中的一個 style 元素上的 title 屬性的值。

refresh 定義文檔自動刷新的時間間隔觉阅。

<meta http-equiv="refresh" content="300">

set-cookie 設(shè)置cookie崖疤,如果網(wǎng)頁過期,那么舊cookie將被刪除典勇。

<meta http-equiv="set-cookie" content="cookievalue=xxx;expires=Monday,12 Jan 2020 20:20:20 GMT;path=/">

content 屬性:

定義與 http-equiv 或 name 屬性相關(guān)的元信息劫哼。

content 屬性給出了與 http-equiv 或 name 屬性相關(guān)的值。

語法

<meta content="text">

屬性值

text :meta 信息的內(nèi)容割笙。

charset屬性:

charset 屬性規(guī)定 HTML 文檔的字符編碼权烧。

提示:charset 屬性可以通過任意元素上的 lang 屬性來重寫。

語法

<meta charset="character_set">

屬性值

character_set :規(guī)定 HTML 文檔的字符編碼伤溉。

常用的值:

UTF-8 - Unicode 字符編碼

ISO-8859-1 - 拉丁字母表的字符編碼

<meta charset ="UTF-8">

在理論上般码,可以使用任何字符編碼,但并不是所有瀏覽器都能夠理解它們乱顾。某種字符編碼使用的范圍越廣板祝,瀏覽器就越有可能理解它。

本篇博客轉(zhuǎn)載地址

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末走净,一起剝皮案震驚了整個濱河市券时,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌伏伯,老刑警劉巖革为,帶你破解...
    沈念sama閱讀 217,185評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異舵鳞,居然都是意外死亡震檩,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,652評論 3 393
  • 文/潘曉璐 我一進(jìn)店門蜓堕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來抛虏,“玉大人,你說我怎么就攤上這事套才∮睾铮” “怎么了?”我有些...
    開封第一講書人閱讀 163,524評論 0 353
  • 文/不壞的土叔 我叫張陵背伴,是天一觀的道長沸毁。 經(jīng)常有香客問我峰髓,道長,這世上最難降的妖魔是什么息尺? 我笑而不...
    開封第一講書人閱讀 58,339評論 1 293
  • 正文 為了忘掉前任携兵,我火速辦了婚禮,結(jié)果婚禮上搂誉,老公的妹妹穿的比我還像新娘徐紧。我一直安慰自己,他們只是感情好炭懊,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,387評論 6 391
  • 文/花漫 我一把揭開白布并级。 她就那樣靜靜地躺著,像睡著了一般侮腹。 火紅的嫁衣襯著肌膚如雪嘲碧。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,287評論 1 301
  • 那天父阻,我揣著相機(jī)與錄音呀潭,去河邊找鬼。 笑死至非,一個胖子當(dāng)著我的面吹牛钠署,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播荒椭,決...
    沈念sama閱讀 40,130評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼谐鼎,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了趣惠?” 一聲冷哼從身側(cè)響起狸棍,我...
    開封第一講書人閱讀 38,985評論 0 275
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎味悄,沒想到半個月后草戈,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,420評論 1 313
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡侍瑟,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,617評論 3 334
  • 正文 我和宋清朗相戀三年唐片,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片涨颜。...
    茶點(diǎn)故事閱讀 39,779評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡费韭,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出庭瑰,到底是詐尸還是另有隱情星持,我是刑警寧澤,帶...
    沈念sama閱讀 35,477評論 5 345
  • 正文 年R本政府宣布弹灭,位于F島的核電站督暂,受9級特大地震影響揪垄,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜逻翁,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,088評論 3 328
  • 文/蒙蒙 一饥努、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧卢未,春花似錦肪凛、人聲如沸堰汉。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,716評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽翘鸭。三九已至滴铅,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間就乓,已是汗流浹背汉匙。 一陣腳步聲響...
    開封第一講書人閱讀 32,857評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留生蚁,地道東北人噩翠。 一個月前我還...
    沈念sama閱讀 47,876評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像邦投,于是被迫代替她去往敵國和親伤锚。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,700評論 2 354

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

  • 1.meta的意義: 在HTML文檔中志衣,meta元素可放置在head標(biāo)簽內(nèi)用于定義整個文檔層面的元數(shù)據(jù)信息屯援。使用m...
    馬建陽閱讀 914評論 0 2
  • 標(biāo)簽提供了 HTML 文檔的元數(shù)據(jù)。元數(shù)據(jù)不會顯示在客戶端念脯,但是會被瀏覽器解析狞洋。META元素通常用于指定網(wǎng)頁的描述...
    shadow123閱讀 597評論 0 0
  • 作者:彭志明日期:2017年4月29日 本文主要針對常用的meta元素的http-equiv,content屬性值...
    pz明閱讀 1,198評論 0 0
  • 雖然之前我有整理過一次meta 標(biāo)簽绿店,但是心中對于meta 標(biāo)簽還是一知半解吉懊,所以再次對meta 標(biāo)簽進(jìn)行整理,并...
    微風(fēng)玉米閱讀 1,160評論 0 0
  • meta 是用來在HTML文檔中模擬HTTP協(xié)議的響應(yīng)頭報(bào)文假勿。meta 標(biāo)簽用于網(wǎng)頁的<head>與<...
    __HAPPINESS_yh閱讀 1,087評論 1 1