HTML 4.01 與 HTML 5 之間meta標(biāo)簽用法的主要差異:
在 HTML 5 中,不再支持 scheme 屬性。
在 HTML 5 中,有一個新的 charset 屬性,它使字符集的定義更加容易。
在 HTML 4.01 中,不得不這么寫:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
在 HTML 5 中,這樣就夠了:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <meta charset="ISO-8859-1">
例子
定義針對搜索引擎的關(guān)鍵詞:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript" />
定義對頁面的描述:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <meta name="description" content="免費的 web 技術(shù)教程。" />
定義頁面的最新版本:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <meta name="revised" content="David, 2008/8/8/" />
每 5 秒刷新一次頁面:
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <meta http-equiv="refresh" content="5" />
屬性
標(biāo)準(zhǔn)屬性
class, contenteditable, contextmenu, dir, draggable, id, irrelevant, lang, ref, registrationmark, tabindex, template, title如需完整的描述,請訪問 HTML 5 中標(biāo)準(zhǔn)屬性。
事件屬性
onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu, ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress, onkeyup, onload, onmessage, onmousedown, onmousemove, onmouseover, onmouseout, onmouseup, onmousewheel, onresize, onscroll, onselect, onsubmit, onunload如需完整的描述,請訪問 HTML 5 中事件屬性。
實例
文檔描述
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <meta name="author" content="w3school.com.cn">
- <meta name="revised" content="David Yang,8/1/07">
- <meta name="generator" content="Dreamweaver 8.0en">
- </head>
- <body>
- <p>本文檔的 meta 屬性標(biāo)識了創(chuàng)作者和編輯軟件。</p>
- </body>
- </html>
Meta 元素中的信息可以描述 HTML 文檔。
文檔關(guān)鍵字
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <meta name="description" content="HTML examples">
- <meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">
- </head>
- <body>
- <p>本文檔的 meta 屬性描述了該文檔和它的關(guān)鍵詞。</p>
- </body>
- </html>
Meta 元素中的信息可以描述文檔的關(guān)鍵詞。
重定向
XML/HTML Code復(fù)制內(nèi)容到剪貼板
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn">
- </head>
- <body>
- <p>
- 對不起。我們已經(jīng)搬家了。您的 URL 是 <a href="http://www.w3school.com.cn"> http://www.w3school.com.cn </a>
- </p>
- <p>您將在 5 秒內(nèi)被重定向到新的地址。</p>
- <p>如果超過 5 秒后您仍然看到本消息,請點擊上面的的鏈接。</p>
- </body>
- </html>
這個例子演示:在網(wǎng)址已經(jīng)變更的情況下,將用戶重定向到另外一個地址。
移動前端開發(fā)中添加一些webkit專屬的HTML5頭部標(biāo)簽,幫助瀏覽器更好解析html代碼,更好地將移動web前端頁面表現(xiàn)出來。本文整理一些常用的meta標(biāo)簽。
XML/HTML Code復(fù)制內(nèi)容到剪貼板