詳述HTML的&lt;meta /&gt;標簽

2024-04-27 15:06:15

字體：大中小

來源：轉載

供稿：網友

meta

　　meta是html語言head區的一個輔助性標簽。幾乎所有的網頁里，我們可以看到類似下面這段的html代碼：　　＜head＞　?。糾eta http-equiv="content-Type" content="text/html; charset=gb2312"＞　　＜/head＞　　也許你認為這些代碼可有可無。其實如果你能夠用好meta標簽，會給你帶來意想不到的效果，例如加入關鍵字會自動被大型搜索網站自動搜集；可以設定頁面格式及刷新等等。　　一、meta標簽的組成　　meta標簽共有兩個屬性，它們分別是http-equiv屬性和name屬性，不同的屬性又有不同的參數值，這些不同的參數值就實現了不同的網頁功能?！　?、name屬性　　name屬性主要用于描述網頁，與之對應的屬性值為content，content中的內容主要是便于搜索引擎機器人查找信息和分類信息用的?！　eta標簽的name屬性語法格式是：＜meta name="參數" content="具體的參數值"＞ ?！　∑渲衝ame屬性主要有以下幾種參數：　　A、KeyWords(關鍵字)　　說明：keywords用來告訴搜索引擎你網頁的關鍵字是什么?！　∨e例：＜meta name ="keywords" content="science, education,culture,politics,ecnomics，relationships, entertaiment, human"＞　　B、description(網站內容描述)　　說明：description用來告訴搜索引擎你的網站主要內容?！　∨e例：＜meta name="description" content="This page is about the meaning of science, education,culture."＞　　C、robots(機器人向導)　　說明：robots用來告訴搜索機器人哪些頁面需要索引，哪些頁面不需要索引。　　content的參數有all,none,index,noindex,follow,nofollow。默認是all。　　舉例：＜meta name="robots" content="none"＞　　D、author(作者)　　說明：標注網頁的作者　　舉例：＜meta name="author" content"root,root@21cn.com"＞　　2、http-equiv屬性　　http-equiv顧名思義，相當于http的文件頭作用，它可以向瀏覽器傳回一些有用的信息，以幫助正確和精確地顯示網頁內容，與之對應的屬性值為content，content中的內容其實就是各個參數的變量值?！　eta標簽的http-equiv屬性語法格式是：＜meta http-equiv="參數" content="參數變量值"＞；其中http-equiv屬性主要有以下幾種參數：　　A、Expires(期限)　　說明：可以用于設定網頁的到期時間。一旦網頁過期，必須到服務器上重新傳輸?！　∮梅ǎ海糾eta http-equiv="expires" content="Fri, 12 Jan 2001 18:18:18 GMT"＞　　注意：必須使用GMT的時間格式?！　、PRagma(cache模式)　　說明：禁止瀏覽器從本地計算機的緩存中訪問頁面內容?！　∮梅ǎ海糾eta http-equiv="Pragma" content="no-cache"＞　　注意：這樣設定，訪問者將無法脫機瀏覽?！　、Refresh(刷新)　　說明：自動刷新并指向新頁面?！　∮梅ǎ海糾eta http-equiv="Refresh" content="2；URL=http://www.root.net"＞　　注意：其中的2是指停留2秒鐘后自動刷新到URL網址?！　、Set-Cookie(cookie設定)　　說明：如果網頁過期，那么存盤的cookie將被刪除?！　∮梅ǎ海糾eta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday, 12-Jan-2001 18:18:18 GMT； path=/"＞　　注意：必須使用GMT的時間格式?！　、Window-target(顯示窗口的設定)　　說明：強制頁面在當前窗口以獨立頁面顯示?！　∮梅ǎ海糾eta http-equiv="Window-target" content="_top"＞　　注意：用來防止別人在框架里調用自己的頁面。　　F、content-Type(顯示字符集的設定)　　說明：設定頁面使用的字符集?！　∮梅ǎ海糾eta http-equiv="content-Type" content="text/html; charset=gb2312"＞　　二、meta標簽的功能　　上面我們介紹了meta標簽的一些基本組成，接著我們再來一起看看meta標簽的常見功能：　?。?、幫助主頁被各大搜索引擎登錄　　meta標簽的一個很重要的功能就是設置關鍵字，來幫助你的主頁被各大搜索引擎登錄，提高網站的訪問量。在這個功能中，最重要的就是對Keywords和description的設置。因為按照搜索引擎的工作原理,搜索引擎首先派出機器人自動檢索頁面中的keywords和decription，并將其加入到自己的數據庫，然后再根據關鍵詞的密度將網站排序。因此，我們必須設置好關鍵字，來提高頁面的搜索點擊率。下面我們來舉一個例子供大家參考：　?。糾eta name="keywords" content="政治,經濟, 科技,文化, 衛生, 情感，心靈，娛樂，生活，社會，企業，交通"＞　?。糾eta name="description" content="政治,經濟, 科技,文化, 衛生, 情感，心靈，娛樂，生活，社會，企業，交通"＞　　設置好這些關鍵字后，搜索引擎將會自動把這些關鍵字添加到數據庫中，并根據這些關鍵字的密度來進行合適的排序?！　。?、定義頁面的使用語言　　這是meta標簽最常見的功能,在制作網頁時,我們在純HTML代碼下都會看到它,它起的作用是定義你網頁的語言,當瀏覽者訪問你的網頁時,瀏覽器會自動識別并設置網頁中的語言,如果你網頁設置的是GB碼,而瀏覽者沒有安裝GB碼,這時網頁只會呈現瀏覽者所設置的瀏覽器默認語言。同樣的,如果該網頁是英語,那么charset=en。下面就是一個具有代表性的例子：　?。糾eta http-equiv=″content－Type″ content=″text/html; charset=gb2312″〉　　該代碼就表示將網頁的語言設置成國標碼?！　。?、自動刷新并指向新的頁面　　如果你想使您的網頁在無人控制的情況下，能自動在指定的時間內去訪問指定的網頁，就可以使用meta標簽的自動刷新網頁的功能。下面我們來看一段代碼：　　〈meta http-equiv=″refresh″ content=″２; URL=http://www.root.net″〉　　這段代碼可以使當前某一個網頁在２秒后自動轉到http://www.root.net頁面中去,這就是meta的刷新作用,在content中,２代表設置的時間（單位為秒）,而URL就是在指定的時間后自動連接的網頁地址?！　。础崿F網頁轉換時的動畫效果　　使用meta標簽，我們還可以在進入網頁或者離開網頁的一剎那實現動畫效果，我們只要在頁面的html代碼中的＜head＞＜/head＞標簽之間添加如下代碼就可以了：　?。糾eta http-equiv="Page-Enter" content="revealTrans(duration=５.０, transition=２０)"＞　?。糾eta http-equiv="Page-Exit" content="revealTrans(duration=５.０, transition=２０)"＞　　一旦上述代碼被加到一個網頁中后，我們再進出頁面時就會看到一些特殊效果，這個功能其實與FrontPage2000中的Format/Page Transition一樣，但我們要注意的是所加網頁不能是一個Frame頁;　?。?、網頁定級評價　　IE4.0以上版本的瀏覽器可以防止瀏覽一些受限制的網站,而之所以瀏覽器會自動識別某些網站是否受限制,就是因為在網站meta標簽中已經設置好了該網站的級別,而該級別的評定是由美國RSAC,即娛樂委員會的評級機構評定的,如果你需要評價自己的網站,可以連接到網站http://www.020webSEO.com/,按要求提交表格,那么RSAC會提供一段meta代碼給你,復制到自己網頁里就可以了。下面就是一段代碼的樣例：　　〈meta http-equiv=″PICS－Label″　　content=′(PICS－1.1 ″http://www.rsac.org/ratingsv01.html″　　l gen true comment ″RSACi North America Server″　　for ″http://www.rsac.org″　　on ″2001.08.16T08:15－0500″　　r (n 0 s 0 v 0 l 0))′〉　?。丁⒖刂祈撁婢彌_　　meta標簽可以設置網頁到期的時間,也就是說,當你在Internet Explorer 瀏覽器中設置瀏覽網頁時首先查看本地緩沖里的頁面,那么當瀏覽某一網頁,而本地緩沖又有時,那么瀏覽器會自動瀏覽緩沖區里的頁面,直到meta中設置的時間到期,這時候,瀏覽器才會去取得新頁面。例如下面這段代碼就表示網頁的到期時間是2001年1月12日18時18分18秒?！　　磎eta http-equiv=″expires″ content=″Friday, 12-Jan-2001 18:18:18 GMT″〉　?。?、控制網頁顯示的窗口　　我們還可以使用meta標簽來控制網頁顯示的窗口，只要在網頁中加入下面的代碼就可以了：＜metahttp-equiv="window-target" content="_top"＞，這段代碼可以防止網頁被別人作為一個Frame調用?！　?、Refresh (刷新) 　　說明：讓網頁多長時間（秒）刷新自己，或在多長時間后讓網頁自動鏈接到其它網頁。　　用法：<Meta http-equiv="Refresh" Content="30"> 　　<Meta http-equiv="Refresh" Content="5; Url=http://www.020webseo.com"> 　　注意：其中的5是指停留5秒鐘后自動刷新到URL網址?！　?、Expires (期限) 　　說明：指定網頁在緩存中的過期時間，一旦網頁過期，必須到服務器上重新調閱。　　用法：<Meta http-equiv="Expires" Content="0"> 　　<Meta http-equiv="Expires" Content="Wed, 26 Feb 1997 08:21:57 GMT"> 　　注意：必須使用GMT的時間格式，或直接設為0(數字表示多少時間后過期)。　　10、Pragma (cach模式) 　　說明：禁止瀏覽器從本地機的緩存中調閱頁面內容。　　用法：<Meta http-equiv="Pragma" Content="No-cach"> 　　注意：網頁不保存在緩存中，每次訪問都刷新頁面。這樣設定，訪問者將無法脫機瀏覽。　　11、Set-Cookie (cookie設定) 　　說明：瀏覽器訪問某個頁面時會將它存在緩存中，下次再次訪問時就可從緩存中讀取，以提高速度。當你希望訪問者每次都刷新你廣告的圖標，或每次都刷新你的計數器，就要禁用緩存了。通常HTML文件沒有必要禁用緩存，對于asp等頁面，就可以使用禁用緩存，因為每次看到的頁面都是在服務器動態生成的，緩存就失去意義。如果網頁過期，那么存盤的cookie將被刪除。　　用法：<Meta http-equiv="Set-Cookie" Content="cookievalue=xxx; expires=Wednesday, 　　21-Oct-98 16:14:21 GMT; path=/"> 　　注意：必須使用GMT的時間格式?！　?2、Window-target (顯示窗口的設定) 　　說明：強制頁面在當前窗口以獨立頁面顯示。　　用法：<Meta http-equiv="Widow-target" Content="_top"> 　　注意：這個屬性是用來防止別人在框架里調用你的頁面。Content選項：_blank、_top、_self、_parent。　　Head中的其它一些用法　　1、scheme (方案)　　說明：scheme can be used when name is used to specify how the value of content should　　be interpreted.　　用法：<meta scheme="ISBN" name="identifier" content="0-14-043205-1" />　　注意：　　2、Link (鏈接)　　說明：鏈接到文件　　用法：<Link href="soim.ico" rel="Shortcut Icon">　　注意：很多網站如果你把她保存在收件夾中后，會發現它連帶著一個小圖標，如果再次點擊進入之后還會發現地址欄中也有個小圖標?，F在只要在你的頁頭加上這段話，就能輕松實現這一功能。<LINK> 用來將目前文件與其它 URL 作連結，但不會有連結按鈕，用於 <HEAD> 標記間，格式如下：　　<link href="URL" rel="relationship"> 　　<link href="URL" rev="relationship">　　3、Base (基鏈接)　　說明：插入網頁基鏈接屬性　　用法：<Base href="http://www.xia8.net/" target="_blank">　　注意：你網頁上的所有相對路徑在鏈接時都將在前面加上“http://www.cn8cn.com/”。其中target="_blank"是鏈接文件在新的窗口中打開，你可以做其他設置。將“_blank”改為“_parent”是鏈接文件將在當前窗口的父級窗口中打開；改為“_self”鏈接文件在當前窗口（幀）中打開；改為“_top”鏈接文件全屏顯示?！　eta的使用方法技巧：　　Meta標簽是用來描述網頁屬性的一種語言，標準的Meta標簽可以便于搜索引擎排序，提高搜索引擎網站權重排名。要想網站做的更符合搜索引擎標準就必須了解meta標簽，下面由Seoer惜緣于大家講講meta標簽含義與使用方法：　　1、META標簽的keywords　　寫法為：<meta name="Keywords" content="信息參數" />　　meat標簽的Keywords的的信息參數，代表說明網站的關鍵詞是什么?！　?、META標簽的Description　　<meta name="Description" content="信息參數" />　　meta標簽的Description的信息參數，代表說明網站的主要內容，概況是什么?！　?、META標簽的http-equiv=Content-Type content="text/html　　http-equiv=Content-Type代表的是HTTP的頭部協議，提示瀏覽器網頁的信息，　　<meta http-equiv="Content-Type" content="text/html; charset=信息參數" />　　meta標簽的Description的信息參數如GB2312時，代表說明網站是采用的編碼是簡體中文；　　meta標簽的Description的信息參數如BIG5時，代表說明網站是采用的編碼是繁體中文；　　meta標簽的Description的信息參數如iso-2022-jp時，代表說明網站是采用的編碼是日文；　　meta標簽的Description的信息參數如ks_c_5601時，代表說明網站是采用的編碼是韓文；　　meta標簽的Description的信息參數如ISO-8859-1時，代表說明網站是采用的編碼是英文；　　meta標簽的Description的信息參數如UTF-8時，代表世界通用的語言編碼；　　4、META標簽的generator　　<meta name="generator" content="信息參數" />　　meta標簽的generator的信息參數，代表說明網站的采用的什么軟件制作?！　?、META標簽的author　　<meta name="author" content="信息參數">　　meta標簽的author的信息參數，代表說明網頁版權作者信息?！　?、META標簽的http-equiv="Refresh"　　<Meta http-equiv="Refresh" Content="時間; Url=網址參數"> 　　meta標簽的Refresh代表多少時間網頁自動刷新，加上Url中的網址參數就代表，多長時間自動鏈接其他網址?！　?、META標簽的HTTP-EQUIV="Pragma" CONTENT="no-cache"　　<META HTTP-EQUIV="Pragma" CONTENT="no-cache">代表禁止瀏覽器從本地計算機的緩存中訪問頁面內容,這樣設定，訪　　問者將無法脫機瀏覽。　　8、META標簽的COPYRIGHT　　<META NAME="COPYRIGHT" CONTENT="信息參數">　　meta標簽的COPYRIGHT的信息參數，代表說明網站版權信息?！　?、META標簽的http-equiv="imagetoolbar"　　<meta http-equiv="imagetoolbar" content="false" /> 　　指定是否顯示圖片工具欄，當為false代表不顯示，當為true代表顯示。　　10、META標簽的Content-Script-Type　　<Meta http-equiv="Content-Script-Type" Content="text/javascript">　　W3C網頁規范，指明頁面中腳本的類型?！　?1、META標簽的revisit-after　　<META name="revisit-after" CONTENT="7 days" > 　　revisit-after代表網站重訪,7 days代表7天，依此類推?！　?2、META標簽的Robots　　<meta name="Robots" contect="信息參數"> 　　Robots代表告訴搜索引擎機器人抓取哪些頁面　　其中的屬性說明如下：　　信息參數為all：文件將被檢索，且頁面上的鏈接可以被查詢；　　信息參數為none：文件將不被檢索，且頁面上的鏈接不可以被查詢；　　信息參數為index：文件將被檢索；　　信息參數為follow：頁面上的鏈接可以被查詢；　　信息參數為noindex：文件將不被檢索，但頁面上的鏈接可以被查詢；　　信息參數為nofollow：文件將不被檢索，頁面上的鏈接可以被查詢?！　?3、META標簽的<meta http-equiv="windows-Target" contect="_top">　　代表頁面在當前窗口中以獨立頁面顯示，可以防止自己的網頁被別人當作一個frame頁調用,設置有：_blank、_top、_self、_parent?！　?4、META標簽的set-cookie　　<meta http-equiv="set-cookie" contect="Mon,12 May 2001 00:20:00 GMT">　　代表Cookie設定，如果網頁過期，存盤的cookie將被刪除,需要注意的也是必須使用GMT時間格式

上一篇：js的向上取整(Math.ceil)向下取整(Math.floor)四舍五入(Math.round)

下一篇：前端要點