?
本文檔使用 PHP中文網手冊 發(fā)布
HTML<area> 元素 在圖片上定義一個熱點區(qū)域，可以關聯(lián)一個超鏈接。<area>元素僅在<map>元素內部使用。
內容分類 | 流內容, 短語內容. |
|---|---|
允許的內容 | None, it is an empty element. |
標簽省略 | Must have a start tag and must not have an end tag. |
允許的父元素 | Any element that accepts phrasing content. The <area> element must have an ancestor <map>, but it need not be a direct parent. |
Permitted ARIA roles | None |
DOM 接口 | HTMLAreaElement |
屬性
鈣元素包括全局屬性。
accesskeyHTML 4only,已廢棄 Gecko 5.0為元素指定一個獲取焦點的快捷鍵。在與指定字符關聯(lián)的情況下，按ALT或類似鍵選擇與該鍵序列相關聯(lián)的表單控件。頁面設計人員避免使用已經綁定到瀏覽器的快捷鍵。這個屬性自HTML5以來是全局性的。
alt在未顯示圖像的瀏覽器上顯示代替的文本字符串。這個文本應該能傳達給用戶與顯示圖像而沒有文本的情況下同等的選擇（譯者注：就是字和圖片表達一個意思）。在HTML4中， 這個屬性時必需的, 但是可以是一個空的串("")。在HTML5中, 這個屬性只有在href屬性被使用的時候才是必需的。
coords給熱點區(qū)域設定具體的坐標值。這個值的數值和意義取決于這個值所描述的形狀屬性.。對于矩形或長方形, 這個coords 值為兩個X,Y對：左上、右下。 對于圓形, 這個值是 x,y,r ，這里的 x,y是一對確定圓的中心的坐標而 r 則表示的是半徑值.。對于多邊和多邊形，這個值是用x,y對表示的多邊形的每一個點：x1,y1,x2,y2,x3,y3,等等。HTML4里, 值可能是像素數量或者百分比, 區(qū)別是不是有%出現; HTML5里, 只可能是像素的數量.downloadHTML5這個屬性如果存在的話, 表明作者想把超鏈接用于下載一個資源。請查看<a>獲得關于download屬性的完整描述。
hrefarea的超鏈接, 值為一個URL. HTML4里, 這個值不管是不是有值都要明確指定出來. HTML5里則不需要.hreflangHTML5指明鏈接資源的語言類型, 值的范圍參考BCP47. 這個屬性只能在指明href屬性之后使用.nameHTML 4only,已廢棄 Gecko 5.0為可點擊區(qū)域定義一個名字以使舊瀏覽器解析。
mediaHTML5指明鏈接資源的媒體類型，例：print and screen。如果此屬性省略，默認全部。僅在href屬性存在情況下使用。nohrefHTML 4only,已廢棄 Gecko 5.0指明此區(qū)域沒有超鏈接。在<area>中必須存在nohref或者href。
Usage note: 此屬性在html5中是廢棄的，而忽略href屬性就足夠了。
referrerpolicy一個字符串，指示在獲取資源時使用哪個引用者：
"no-referrer"這意味著Referer:頭不會被發(fā)送。
“
no-referrer-when-downgrade”表示Referer:當導航到沒有TLS（HTTPS）的原點時，不會發(fā)送標題。如果沒有指定策略，這是用戶代理的默認行為。
"origin"這意味著引用者將成為頁面的來源，即大致的方案，主機和端口。
“起源 - 交叉起源”意味著到其他起源的導航將限制在該方案，主機和端口，同一來源的導航將包括引用者的路徑。
"unsafe-url"這意味著引用者將包括來源和路徑（但不包括片段，密碼或用戶名）。這種情況是不安全的，因為它可以將來自TLS保護的資源的起點和路徑泄漏到不安全的起點。
relHTML5對于包含href屬性的錨點，此屬性指定目標對象與鏈接對象的關系。該值是鏈接類型值的逗號分隔列表。值和它們的語義將由某個權威機構注冊，這對文檔作者可能有意義。默認的關系，如果沒有給出，是無效的。只有當href屬性存在時才使用此屬性。
shape相關熱點的形狀。HTML 5和HTML 4的規(guī)范定義了rect定義矩形區(qū)域的值; circle，它定義了一個圓形區(qū)域; poly，它定義了一個多邊形; 和default，這表示整個區(qū)域超出任何定義的形狀。許多瀏覽器，特別是Internet Explorer 4和更高的支持circ，polygon以及rectangle對作為有效值形狀 ; 這些值是。僅限HTML 4，自從Gecko 5.0A數值指定瀏覽器標簽順序中已定義區(qū)域的位置以來已過時。該屬性在HTML5中是全局的。此屬性指定顯示鏈接資源的位置。在HTML4中，這是框架的名稱或關鍵字。在HTML5中，它是瀏覽上下文（例如，選項卡，窗口或內聯(lián)框架）的名稱或關鍵字。以下關鍵字具有特殊含義：tabindextarget
_self: 在當前區(qū)域加載鏈接指向的資源. 這個是默認值.
_blank: 在新的未命名的窗口或者tab里加載超鏈接資源.
_parent: 在父級加載超鏈接資源. HTML4里, 是當前frame的父級, HTML5里是當前的瀏覽器上下文, 如果當前環(huán)境沒有父級, 行為和_self一樣.
_top: HTML4里: 將響應加載到完整的原始窗口中，取消所有其他幀。在HTML5中:將響應加載到頂級瀏覽上下文(也就是說，瀏覽上下文是當前版本的祖先，并且沒有父類)。如果沒有父類，這個選項的行為方式與self相同
本屬性只能在指明href屬性之后使用.
type該屬性指定了用于鏈接目標的MIME類型的媒體類型。一般來說，這是嚴格的咨詢信息;然而，在未來，瀏覽器可能會為多媒體類型添加一個小圖標。例如，當類型設置為音頻/wav時，瀏覽器可能會添加一個小的揚聲器圖標。公認的MIME類型的完整列表,請參閱http://www.w3.org/TR/html4/references.html ref-MIMETYPES。只有當href屬性存在時才使用該屬性。
示例
<map name="primary"> <area shape="circle" coords="75,75,75" href="left.html" alt="Click to go Left"> <area shape="circle" coords="275,75,75" href="right.html" alt="Click to go Right"></map><img usemap="#primary" src="http://placehold.it/350x150" alt="350 x 150 pic">
Live Example
注意事項
HTML 3.2, 4.0, 和HTML 5 規(guī)范中, 不允許有 </area> 單閉合標簽.
XHTML 1.0 規(guī)范要求有尾部的斜線:<area />.
id,class, 和style屬性和其他的HTML4屬性一樣, 但是只有Netscape和Microsoft定義了這些屬性.
Netscape 1–level 瀏覽器不能解析target 鏈接到frames的屬性.
HTML 3.2 只定義了alt,coords,href,nohref, 和shape.
HTML 5.1 定義了這個標簽上的屬性類型。
規(guī)范
規(guī)范 | 狀態(tài) | 評論 |
|---|---|---|
引用者策略該規(guī)范中“引用策略屬性”的定義。 | 編輯草稿 | 增加了referrerpolicy屬性。 |
WHATWG HTML生活標準該規(guī)范中'<area>'的定義。 | 生活水平 | |
HTML5該規(guī)范中'<area>'的定義。 | 建議 | |
HTML 4.01規(guī)范該規(guī)范中'<area>'的定義。 | 建議 |
瀏覽器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |
referrerpolicy | 51 | No support | 50 (50) | No support | No support | No support |
Feature | Android | Android Webview | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mini | Opera Mobile | Safari Mobile | Chrome for Android |
|---|---|---|---|---|---|---|---|---|---|
Basic support | ? | (Yes) | (Yes) | ? | ? | ? | ? | ? | (Yes) |
referrerpolicy | No support | No support | No support | 50.0 (50) | No support | No support | No support | No support | No support |