舉例講解HTML中META標簽的一些使用技巧
我要評論HTML meta 標簽
HTML meta 標簽可以用來提供網(wǎng)頁內容的信息給瀏覽器或是搜尋引擎，例如網(wǎng)頁內容的描述、網(wǎng)頁重要關鍵字、網(wǎng)頁編碼等都是常用 meta 來標示的網(wǎng)頁信息，另外還有網(wǎng)頁作者、網(wǎng)頁發(fā)布時間、所使用的編輯器等較不重要的信息，也可以透過 META TAG 來標示，META 的功能僅是用來注明這些網(wǎng)頁信息，且提供給瀏覽器或是搜尋引擎，并非是要給寫給瀏覽網(wǎng)頁的＂人＂看的內容。
HTML meta 標簽寫在 head 范例
- <head>
- <title>測試網(wǎng)頁</title>
- <meta name="description" content="這里是網(wǎng)頁的簡短描述">
- <meta name="keywords" content="關鍵字 1,關鍵字 2">
- </head>
標準的 <meta> 標簽沒有結尾，直接將參數(shù)寫在 <meta> 內即可，一個網(wǎng)頁內可以有很多個不同的 <meta> 標簽，全部都要寫在 head 標簽內，范例中的 title 標簽是用來標示網(wǎng)頁標題用的，可以寫在 <meta> 標簽之前，也可以寫在 <meta> 標簽之后。
一、顯示及排列中文
- <META http-equiv="Content-Type" content="text/html; charset=big5">
說明：
Content-Type==>文件內容格式
;==>CONTENT內要作的每件事" "，分別以分號區(qū)隔
text/html==>純文字/超文字
charset==>字符組為中文繁體大五碼，如用iso-2022-jp是指日文
二、讓搜索引擎容易找到您
- <META NAME="KeyWords" CONTENT="計算機教學'網(wǎng)絡教學'Linux教學'CSS教學'HTML教學'軟件教學'發(fā)信教學'SEO教學'交換連結">
- <META NAME="KeyWords" CONTENT="css'HomePage'html'linux'seo">
說明：網(wǎng)頁內文關鍵字，可使用中、英文均可
三、關于網(wǎng)站的內容描述
- <META NAME="Description" CONTENT="這是一個免費學習網(wǎng)頁制作的好地方，網(wǎng)絡研究所">
說明：Description==>內容的主要描述
四、這個網(wǎng)頁的作者是誰
- <META NAME="Author" CONTENT="PCNET">
說明：標注本網(wǎng)頁作者姓名等資料
五、這是用何編輯器完成的網(wǎng)頁
- <META NAME="Generator" CONTENT="Mozilla/3.0Gold(Win95)[Netscape]">
說明：
標注本網(wǎng)頁作者姓名等資料
Generator==>編輯器
Mozilla/3.0Gold(Win95)[Netscape]==>編輯器等版本說明
六、這個網(wǎng)頁何時完成
- <META NAME="Creation-Date" CONTENT="01-jan-2003 20:40:01">
說明：
Creation-Date==>創(chuàng)作日期
01-jan-2003 20:40:01==>詳細日期時間
七、這個網(wǎng)頁有效時期及不被Cache所限制
- <META NAME="Expired" CONTENT="01-jan-2005 00:00:00">
- <META HTTP-EQUIV="Pragma" CONTENT="no_cache">
說明：
Expired==>網(wǎng)頁終止期限
01-jan-2005 00:00:00==>已過去的日期時間，也可以用Mon,12 Jan 2007 00:00:00 GMT
no_cache==>不被Cache所限制，也就是網(wǎng)頁沒有記憶功能。
八、網(wǎng)頁作者的網(wǎng)址與信箱
- <link rev="made" href="mailto:pcnettw@yahoo.com.tw">
- <link rev="made" href="http://www.pcnet.idv.tw/">
說明：網(wǎng)頁作者信箱或網(wǎng)址陳述
rev==>正向關聯(lián)
made=>網(wǎng)頁制造者
href==>您的信箱或網(wǎng)址
九、使網(wǎng)頁能自動換頁
- <META HTTP-EQUIV="refresh" CONTENT="15; url=http://www.pcnet.idv.tw/">
說明：
refresh==>更新或重整
15==>15秒后執(zhí)行下一動作
;==>CONTENT內要作的每件事" "，分別以分號區(qū)隔
url=http://www.pcnet.idv.tw/==>指定轉換到此網(wǎng)頁
十、進入或離開的特效(限IE使用)
- <META http-equiv="指定要換頁特效發(fā)生的狀況" content="特效模式(Duration=特效持續(xù)時間,Transition=代替的特效)">
說明：
http-equiv="Page-Enter是進入本頁、Page-Exit是離開本頁、Site-Enter是進入本站、Site-Exit是離開本站"。
content="revealTrans(指定換頁特效)、blendTrans(設定換頁特效為"混合")。
Duration=設定特效持續(xù)的時間(秒)，建議在3-5秒之間。
Transition=以0-23代替特效(略)。
注：
它必須放于<HEAD>與</HEAD>之間，主要用于本網(wǎng)頁的內容說明，以利自己或別人(搜索引擎)使用，另外也可以制造出一些自動翻頁等特殊效果。
http-equiv或NAME屬性，必須配合content屬性使用，兩者也可互替使用。
后設語法標簽(META description tag)的用法隨各搜索引擎設定有所不同。
有無Meta標簽，并不影響網(wǎng)頁正常顯示，其最大目的在于提供網(wǎng)頁各種信息及產(chǎn)生特殊效果。
網(wǎng)頁運用，建議以本頁所述1.2.3.4.8項這些標簽為主，其余視況自行增減。
您可使用檢視原始碼，來看本例實際安排。
更多的報導資料，歡迎蒞臨講師(作者)網(wǎng)站查看。
相關文章
- <meta> 元素可提供有關頁面的元信息（meta-information），比如針對搜索引擎和更新頻度的描述和關鍵詞。這篇文章給大家介紹了html中meta標簽及用法詳解，感興趣的朋2018-02-23
HTML標簽meta總結,HTML5 head meta 屬性整理
移動前端開發(fā)中添加一些webkit專屬的HTML5頭部標簽，幫助瀏覽器更好解析HTML代碼，更好地將移動web前端頁面表現(xiàn)出來。本文整理一些常用的meta標簽,需要的朋友可以參考下2017-06-29- 本文給大家介紹了html5中各種頭部meta標簽功能小結，非常不錯，具有參考借鑒價值，需要的的朋友參考下2017-03-13
- 這篇文章給大家查找總結了一些HTML5頭部<meta>標簽常用的一些信息，文章給出了示例代碼與注釋，介紹的很詳細，感興趣的朋友們下面來一起看看吧。2016-10-23
- 制作手機版網(wǎng)站的時候，除了頁面簡潔、操作方便等訪問者可以看到的地方以外，就是 Meta 標簽的設置，合理設置 Meta 標簽 對手機版網(wǎng)站的搜索引擎優(yōu)化，手機瀏覽器的渲染展2016-01-06
- 這篇文章主要介紹了HTML5下meta標簽的一些應用方法實例,包括在移動前端頁面上的一個使用例子,需要的朋友可以參考下2015-12-08
常用HTML meta 標簽屬性(網(wǎng)站兼容與優(yōu)化需要)
標簽提供關于HTML文檔的元數(shù)據(jù)。元數(shù)據(jù)不會顯示在頁面上，但是對于機器是可讀的。它可用于瀏覽器（如何顯示內容或重新加載頁面），搜索引擎（關鍵詞），或其他 web 服務2014-12-27HTML頭標簽meta實現(xiàn)refresh重新定向
這篇文章主要介紹了HTML頭標簽meta實現(xiàn)refresh重新定向,需要的朋友可以參考下2014-05-02- 這篇文章主要介紹了HTML中的<meta>標簽的使用，非常不錯，具有一定的參考借鑒價值，需要的朋友參考下吧2018-06-05