最新的Web開發教程
 

HTML <area> Tag


圖像映射,可點擊方面:

<img src="planets.gif" width="145" height="126" alt="Planets"
usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>
試一試»

定義和用法

<area>標籤定義圖像映射(圖像映射是帶有可點擊區域的圖像)內的區域。

<area>元素始終嵌套在裡面<map>標記。

注意: usemap在屬性<img>標記與相關聯的<map>元素的name屬性,並創建圖像和地圖之間的關係。


瀏覽器支持

元件
<area>

HTML 4.01和HTML5之間的差異

HTML5有一些新的屬性,以及一些HTML 4.01屬性都不再支持。


HTML和XHTML之間的差異

在HTML中的<area>標籤沒有結束標籤。

在XHTML中的<area>標籤必須正確關閉。


屬性

=新的HTML5。

屬性 描述
alt text 指定區域的替代文本。 如果需要的href屬性存在
coords coordinates 指定區域的坐標
download filename 指定當用戶點擊超鏈接的目標將被下載
href URL 指定的超鏈接目標區域
hreflang language_code 指定目標URL的語言
media media query 指定的介質/設備的目標URL被優化
nohref value 在HTML5不支持。
指定一個區域沒有相關鏈接
rel alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
指定當前文件和目標URL之間的關係
shape default
rect
circle
poly
指定的區域的形狀
target _blank
_parent
_self
_top
framename
規定在何處打開目標URL
type media_type 指定目標URL的媒體類型

全局屬性

<area>標籤支持全局的HTML屬性


事件屬性

<area>標籤支持的HTML事件屬性


相關頁面

HTML DOM參考: Area對象


默認設置CSS

大多數瀏覽器會顯示<area>元素與以下默認值:

area {
    display: none;
}