HTML <map> etiketi

Tanım ve Kullanım

<map> etiketi, görüntü haritasını tanımlamak için kullanılır. Görüntü Haritası (image map, bir bölge navigasyon haritası), tıklanabilir alanlara sahip bir görüntüdür.

<map> Öğesi name Özelliğiile bu özellik <img> Öğesi nın usemap Özelliği ilişkili, görüntü ve harita arasındaki ilişkiyi oluşturur.

<map> Öğesi bazı <area> Öğesi,görüntü haritalarındaki tıklanabilir alanları tanımlar.

Ayrıca bakınız:

HTML DOM Referans Kılavuzu:Harita Objesi

Örnek

Örnek 1

Tıklayabilir alanlı görüntü haritası:

<img src="life.png" alt="Life" usemap="#lifemap" width="650" height="451">
<map name="lifemap">
  <area shape="rect" coords="10,208,155,338" alt="AirPods" href="airpods.html">
  <area shape="rect" coords="214,65,364,365" alt="iPhone" href="iphone.html">
  <area shape="circle" coords="570,291,75" alt="Coffee" href="coffee.html">
</map>

Kişisel olarak deneyin

Örnek 2

Bir tıklayabilir alanlı başka bir görüntü haritası:

<img src="solarsystem.png" width="1024" height="576" alt="Planets" usemap="#planetmap">
<map name="planetmap">
  <area shape="rect" coords="0,0,114,576" alt="Sun" href="sun.html">
  <area shape="circle" coords="190,230,5" alt="Mercury" href="mercury.html">
  <area shape="circle" coords="228,230,5" alt="Venus" href="venus.html">
</map>

Kişisel olarak deneyin

Öznitelik

Öznitelik Değer Açıklama
name Harita Adı Gerekli. Resim haritasının adını belirtir.

Genel öznitelikler

<map> Bu etiketler ayrıca HTML'deki genel öznitelikler.

olay özniteliği

<map> Bu etiketler ayrıca HTML'deki olay özniteliği.

Varsayılan CSS Ayarları

Çoğu tarayıcı aşağıdaki varsayılan değerleriyle gösterir: <map> Element:

map {
  display: inline;
}

Tarayıcı Desteği

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Destek Destek Destek Destek Destek