免費(fèi)AI編程助手
HTML 元數(shù)據(jù)
HTML元數(shù)據(jù)
title
title 元素設(shè)置文檔的標(biāo)題。
瀏覽器通常會(huì)在瀏覽器窗口或選項(xiàng)卡的頂部顯示此元素的內(nèi)容。
每個(gè)HTML文檔應(yīng)該只有一個(gè)標(biāo)題元素。
標(biāo)題文本應(yīng)該對(duì)用戶有意義。
以下代碼顯示了正在使用的標(biāo)題元素。
<!DOCTYPE HTML>
<html>
<head>
<title>Example from www.o2fo.com</title>
</head>
<body>
<p>This is a test.</p>
<a href="http://www.o2fo.com">Visit www.o2fo.com</a>
</body>
</html>HTML Base
base 元素為相對(duì)鏈接設(shè)置基本URL。
相對(duì)鏈接是省略URL的協(xié)議，主機(jī)和端口部分的鏈接并且針對(duì)一些其他URL(由基本元素或由基本元素指定的URL)進(jìn)行評(píng)估用于加載當(dāng)前文檔的URL。
base 元素也指定如何在用戶單擊鏈接時(shí)打開鏈接，以及在表單提交后瀏覽器的行為。
base 元素有兩個(gè)局部屬性
- href
- target
HTML文檔最多只能包含一個(gè)基本元素。
href屬性
href 屬性指定基本URL將解析文檔中的相對(duì)URL。
以下代碼顯示了正在使用的 base 元素和 href 屬性。
<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<base href="http://www.o2fo.com/listings/"/>
</head>
<body>
<p>This is a test.</p>
<a href="http://www.o2fo.com">Visit www.o2fo.com</a>
<a href="/javascript.html">JavaScript</a>
</body>
</html>上面的代碼將基本URL設(shè)置為//www.o2fo.com/listings/
www.o2fo.com 是服務(wù)器的名稱，和listings是服務(wù)器上的目錄。
稍后在文檔中，它使用相對(duì)URL創(chuàng)建一個(gè)超鏈接javascript.html
當(dāng)用戶單擊超鏈接時(shí)，瀏覽器將組合基本URL和相對(duì)的URL來(lái)創(chuàng)建組合網(wǎng)址 //www.o2fo.com/listings/javascript.html
如果不使用 base 元素，那么瀏覽器將假設(shè)它應(yīng)該解析與當(dāng)前文檔的URL的任何相對(duì)鏈接。
例如，如果從中加載文檔URL //www.o2fo.com/app/mypage.html 和它包含相對(duì)網(wǎng)址為 myotherpage.html 的超鏈接，那么瀏覽器將嘗試加載第二頁(yè)從完全限定的網(wǎng)址 //www.o2fo.com/app/myotherpage.html
target屬性
target 屬性指示瀏覽器如何打開網(wǎng)址。
您為此屬性指定的值表示瀏覽上下文。
HTML元數(shù)據(jù)
meta 元素定義文檔的元數(shù)據(jù)。
您可以以不同的方式使用此元素，并且HTML文檔可以包含多個(gè)元素元素。
meta 元素有局部屬性，包括 name，content，charset，http-equiv 。
charset 屬性是HTML5中的新功能HTML4 scheme 屬性現(xiàn)在已過(guò)時(shí)。
元素的每個(gè)實(shí)例只能用于這些目的之一。
名稱/值元數(shù)據(jù)對(duì)
meta 元素的第一個(gè)用途是定義名稱/值對(duì)中的元數(shù)據(jù)，您使用 name 和 content 屬性。
以下代碼使用meta元素在名稱/值對(duì)中定義元數(shù)據(jù)。
<!DOCTYPE HTML>
<html>
<head>
<meta name="author" content="www.o2fo.com"/>
<meta name="description" content="A simple example"/>
</head>
<body>
<a href="http://www.o2fo.com">Visit www.o2fo.com</a>
</body>
</html>您可以使用 name 屬性來(lái)指定元素引用的元數(shù)據(jù)類型，和content屬性來(lái)提供一個(gè)值。
下表列出了可以與meta元素一起使用的預(yù)定義元數(shù)據(jù)類型。
| 元數(shù)據(jù)名稱 | 描述 |
|---|---|
| application name | 當(dāng)前頁(yè)面所屬Web應(yīng)用程序的名稱 |
| author | 當(dāng)前頁(yè)的作者的名稱 |
| description | 當(dāng)前頁(yè)面的描述 |
| generator | 生成HTML的軟件的名稱 |
| keywords | 一組用逗號(hào)分隔的字符串，用于描述內(nèi)容 |
除了五個(gè)預(yù)定義的元數(shù)據(jù)名稱之外，您還可以使用元數(shù)據(jù)擴(kuò)展。請(qǐng)?jiān)L問(wèn)http://wiki.whatwg.org/wiki/MetaExtensions，查看這些擴(kuò)展程序的列表。
robots 元數(shù)據(jù)類型被廣泛使用。它允許HTML文檔的作者指定文檔應(yīng)如何被搜索引擎處理。例如:
<meta name="robots" content="noindex">
大多數(shù)搜索引擎將識(shí)別的三個(gè)值是
- noindex - 不要索引此頁(yè)面
- noarchive - 不要?jiǎng)?chuàng)建此頁(yè)面的存檔或緩存版本
- nofollow - 不要追蹤（即抓?。┐隧?yè)面的鏈接
HTML字符集
要正確顯示HTML頁(yè)面，我們必須設(shè)置字符集(字符編碼)。
meta 元素的另一個(gè)用途是聲明字符編碼。
下面的代碼中顯示了一個(gè)示例。
<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<meta name="author" content="www.o2fo.com"/>
<meta name="description" content="A simple example"/>
<meta charset="utf-8"/>
</head>
<body>
<p>This is a test.</p>
<a href="http://www.o2fo.com">Visit www.o2fo.com</a>
</body>
</html>字符集設(shè)置為UTF-8編碼。UTF-8是一種常見(jiàn)的字符編碼。
字符編碼
- ASCII是第一個(gè)字符編碼標(biāo)準(zhǔn)。它定義127個(gè)字母數(shù)字字符。ASCII支持的數(shù)字（0-9），英文字母（A-Z）和一些特殊字符！ $ + - （）@ <>。
- ANSI（Windows-1252）是原始的Windows字符集。它支持256種不同的字符代碼。
- ISO-8859-1是HTML 4的默認(rèn)字符集。它支持256種不同的字符代碼。
- UTF-8（Unicode）涵蓋了世界上幾乎所有的字符和符號(hào)。HTML5的默認(rèn)字符編碼為UTF-8。
HTML http-equiv
元素的最終用途是覆蓋HTTP（超文本傳輸??協(xié)議）頭之一的值。
HTTP通常用于在服務(wù)器和瀏覽器之間傳輸HTML數(shù)據(jù)。
來(lái)自服務(wù)器的每個(gè)HTTP響應(yīng)都包含一系列描述內(nèi)容的標(biāo)題，您可以使用 meta 元素來(lái)模擬或替換其中的三個(gè)頭。
以下代碼使用meta元素來(lái)模擬HTTP標(biāo)頭
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="refresh" content="5"/>
</head>
<body>
<p>This is a test</p>
<a href="http://www.o2fo.com">Visit www.o2fo.com</a>
</body>
</html>您可以使用 http-equiv 屬性指定要模擬的標(biāo)題，和 content 屬性以提供要使用的值。
在上面的代碼中， refresh 頭設(shè)置為5，它要求瀏覽器每五秒重新加載頁(yè)面。
Jump
如果使用分號(hào)和URL跟隨刷新間隔，瀏覽器將在間隔過(guò)去之后加載指定的URL。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="refresh" content="3; http://www.www.o2fo.com"/>
</head>
<body>
<p>This is a test.</p>
<a href="http://www.o2fo.com">www.o2fo.com</a>
</body>
</html>以下列出了 http-equiv 屬性的三個(gè)允許值。
- 屬性值:refresh
設(shè)置一個(gè)周期（以秒為單位），之后，將從服務(wù)器重新加載當(dāng)前頁(yè)面。您還可以指定要加載的其他URL。 例如：<meta http-equiv="refresh" content="5; https://www.www.o2fo.com"/> - 屬性值:default-style
設(shè)置應(yīng)該用于此頁(yè)面的首選樣式表。 content屬性的值必須與同一文檔中的腳本或鏈接元素上的title屬性匹配。 - 屬性值:content-type
這是一種指定HTML頁(yè)面的字符編碼的替代方法。例如:<meta http-equiv="content-type" content="text/html charset=UTF-8"/>
更多建議：