meta

meta標記的主要功能是定義頁面中的信息,這些信息並不會顯示在瀏覽器中而只在源代碼中顯示。meta標記通過屬性定義文件信息的名稱、內容等,能夠提供文檔的關鍵字、作者及描述等多種信息,在HTML頭部可以包括任意數量的meta標記。

格式:<meta name="屬性名稱" content="屬性內容" />

1.定義頁面關鍵字(屬性名稱爲:keywords):是爲了向搜索引擎說明網頁的關鍵詞,從而幫助搜索引擎對該網頁進行查找和分類,它可以提高被搜索到的概率,有時搜索引擎在檢索時限制關鍵字的數量,因此在設置關鍵字時不要過多,關鍵字之間用逗號隔開

語法:<meta name="keywords" content="關鍵字的內容" />

例如:<meta name="keywords" content="網頁,教程" />

 

2.定義頁面描述(屬性名稱爲:description):用來描述網頁的主題,與關鍵字一樣,是爲了便於搜索引擎的查找。

語法:<meta name="description" content="定義頁面描述內容" />

例如:<meta name="description" content="網頁製作教程網站" />

疑問:是否可以同1中的一樣,有多個頁面描述,然後用逗號隔開?

 

3.定義編輯工具(屬性名稱爲:generator):越來越多的可視化軟件也可以製作網頁,在源代碼的頭部中可以設置網頁編輯軟件的名稱

語法:<meta name="generator" content="定義編輯工具的名稱" />

例如:<meta name="generator" content="Dreamwaver" />

疑問:是否可以同1中的一樣,有多個編輯工具, 然後用逗號隔開?

 

4.定義作者信息(屬性名稱爲:author):可以定義作者的姓名及個人信息

語法:<meta name="author" content="作者的姓名" />

例如:<meta name="author" content="風葉" />

疑問:是否可以同1中的一樣,有多個作者, 然後用逗號隔開?

 

5.限制搜索方式(屬性名稱爲:robots):可以限制搜索引擎搜索當前網頁的方式

語法:<meta name="robots" content="搜索方式" />

搜索方式的取值
屬性值
說明
all 能搜索當前網頁及其鏈接的網頁
index 能搜索當前網頁
nofollow 不能搜索與當前網頁鏈接的網頁
noindex 不能搜索當前網頁
none 不能搜索當前網頁及與其鏈接的網頁

 

例如:<meta name="robots" content="index" />

疑問:是否可以同1中的一樣,有多個多個取值方式, 然後用逗號隔開還有index下,是否不能搜索與當前網頁鏈接的網頁?

 

6.定義網頁文字及語言(無屬性名稱,這個比較特殊~):可以設置語言的編碼方式,這樣瀏覽器可以正確地選擇語言,而不需要人工選取。

語法:<meta http-equiv="content-type" content="text/html;charset=字符集類型" />

說明:http-equiv用於傳送HTTP通信協議的標頭,而在content中才是具體的屬性值。charset用於設置網頁的內碼語系,也就是字符集的類型,國內常用的是GB碼,charset往往設置爲gb2312,即簡體中文。英文是ISO-8859-1字符集,此外還有其他的字符集。

例如:<meta http-equiv="content-type" content="text/html;charset=gb2312" />

疑問:content裏的設置是什麼意思呢?這裏爲什麼沒有屬性名稱的設置呢?

 

7.定義網頁的定時跳轉(無屬性名稱,這個也比較特殊~):就是在經過一段時間後,會自動轉到其他網頁中,這就是網頁的跳轉。

語法:<meta http-equiv="refresh" content="跳轉時間;URL=跳轉到的地址" />

說明:refresh表示設置網頁的刷新,而在content中給出了刷新的時間和刷新後的地址,時間和鏈接地址之間用分號。默認情況下,跳轉時間以爲單位。(不僅可以實現頁面之間的跳轉,而且可以完成頁面自身的自動刷新,但爲想效果不會很好的吧~)

例如:<meta http-equiv="refresh" content="5;URL=index.html" />

疑問:爲什麼沒有屬性名稱的設置呢

 

8.定義網頁的過渡效果(無屬性名稱,這個也比較特殊~):是指當進入或離開網站時,頁面具有不同的切換效果,添加此功能可以使網頁看起來更具動感。(好像就ie支持的樣子,測試起來有些麻煩)

語法:<meta http-equiv="過渡事件" content="revealtrans(duration=過渡效果的持續時間,transition=過渡方式)" />

說明:過渡事件可以是進入頁面或者離開頁面,進入頁面的http-equiv值爲page-enter,離開的頁面的http-equiv值爲page-exist。過渡效果的持續時間默認情況下以秒爲單位,過渡方式取值如不表所示。

過渡方式的編號
編號 過渡方式 編號 過渡方式
0 盒狀收縮 12 隨意溶解
1 盒狀放射 13 從左右兩端向中間展開
2 圓形收縮 14 從中間兩端向左右展開
3 圓形放射 15 從上下兩端向中間展開
4 由下往上 16 從中間兩端向上下展開
5 由上往下 17 從右下角向左下角展開
6 從左至右 18 從右下角向左上角展開
7 從右至左 19 從左上角向右下角展開
8 垂直百葉窗 20 從左上角向右上角展開
9 水平百葉窗 21 水平線狀展開
10 水平格狀百葉窗 22 垂直線狀展開
11 垂直格狀百葉窗 23 隨機產生一種過渡方式

例如:<meta http-equiv="page-enter" content="revealtrans(duration=5,transition=8)" />

疑問:content裏的設置是什麼意思呢,revealtrans是什麼呢,是否就ie支持的

發佈了115 篇原創文章 · 獲贊 6 · 訪問量 11萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章