meta元素有4個屬性:name、http-equiv、content、charset.meta標簽通過name屬性來表述頁面文檔的元信息,通過http-equiv屬性設置http請求指令,通過charset設置頁面的字元編碼。按照屬性設置分類,meta可以分為三類: name屬性和content屬 ...
meta元素有4個屬性:name、http-equiv、content、charset.meta標簽通過name屬性來表述頁面文檔的元信息,通過http-equiv屬性設置http請求指令,通過charset設置頁面的字元編碼。按照屬性設置分類,meta可以分為三類:
-
name屬性和content屬性組合,構成名稱/值對,用於描述網站信息.
標準的meta名稱包括application-name、author、description、generator等。
示例代碼:
<meta name="keywords" content="british,typeface,font,fonts"/>其中keywords和description這兩個名稱的使用率最高,是搜索引擎優化的主要手段之一,推薦讀者使用。
-
http-equiv屬性和content屬性組合,設置特定的http指令;
其中content-type、default-style和refresh已經確定,content-language和set-cookie還未正式確定.
此類型meta應該謹慎使用。不推薦使用<meta http-equiv="refresh" content="300"/>,某些搜索引擎遇到此meta時會停止解析 頁面剩餘的部分。<meta http-equiv="default-style">在實際的場景中很少使用 -
charset屬性,設置頁面字元編碼。
此屬性提供了保存和傳輸文檔的編碼格式。
<meta charset="utf-8">
等價於
<meta http-equiv='Content-Type' content='Type=text/html; charset=utf-8'>
但是第一種形式更簡潔好記,並且得到了所有主流瀏覽器的支持,所有不存在瀏覽器相容問題。為 了讓瀏覽器能準確識別編碼格式,務必在<title>標簽之前設置charset,保證標題能正確顯示。除了W3C定義的規範中定義的這些meta之外,還有大量的自定義meta類型。這些meta類型主要是由互聯網公司或者瀏覽器廠商為了實現特定的功能而定製的。這些自定義的meta不能通過W3C提供的標準校驗,但並不是說這些meta不標準。介紹一些常用的meta
設置IE瀏覽器的相容模式
從IE8瀏覽器開始支持一種設置頁面相容模式的meta類型,示例代碼如下:
<meta http-equiv="X-UA-Compatible" content="IE=8"/>
根據html規範,瀏覽器是按照頁面開頭定義的文檔類型來解析頁面的。例如,使用html5的文檔類型聲明:
<!DOCTYPE html>
IE就會以標準模式解析HTML文檔。但是某些已有頁面由於各種原因不能在最新標準模式下正確顯示,只支持特定的標準。針對這種情況,IE瀏覽器提供了一種相容的方案,通過設置X-UA-Compatible指定頁面在IE瀏覽器中渲染時執行的標準。
此外還有一種很常見的設置值,即:
<meta http-equiv="X-UA-Compatible" content="chrome=1"/>
IE定義的meta為什麼會出現chrome呢?其實設置為chrome=1時,則會在IE9及以下瀏覽器中激活Chrome Frame,強制IE使用Chrome Frame渲染頁面。