Örnek
<img src="http://lorempixel.com/output/cats-q-c-300-300-9.jpg" width="145" height="126" alt="Planets"
usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="http://lorempixel.com/output/cats-q-c-300-300-3.jpg" alt="Sun">
<area shape="circle" coords="90,58,3" href="http://lorempixel.com/output/cats-q-c-300-300-3.jpg" alt="Mercury">
<area shape="circle" coords="124,58,8" href="http://lorempixel.com/output/cats-q-c-300-300-3.jpg" alt="Venus">
</map>
Resmin üzerinde belirli bir alanı seçmek için kullanılır. Bu etiket sadece <map> elementi içinde kullanılırsa geçerli olur.
Codepen Ön izleme
<img src="http://lorempixel.com/output/cats-q-c-300-300-9.jpg" width="145" height="126" alt="Planets"
usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="http://lorempixel.com/output/cats-q-c-300-300-3.jpg" alt="Sun">
<area shape="circle" coords="90,58,3" href="http://lorempixel.com/output/cats-q-c-300-300-3.jpg" alt="Mercury">
<area shape="circle" coords="124,58,8" href="http://lorempixel.com/output/cats-q-c-300-300-3.jpg" alt="Venus">
</map>
See the Pen HTML area Tag by W3TR (@w3tr) on CodePen.
Nitelikler
Nitelik |
Değer |
Açıklama |
alt |
text |
Alan için alternatif bir isim belirlemek için kullanılır. Href özelliğinin olması gerekir. |
coords |
coordinates |
Alanın koordinatlarını belirlemek için kullanılır. |
download |
filename |
Kullanıcı bağlantıya tıkladığında belirlediğimiz hedef deki dosyayı yüklemek için kullanılır. |
href |
URL |
Bağlantı oluşturmak için kullanılır. |
hreflang |
language_code |
Oluşturduğumuz bağlantının URL dilini belirlemek için kullanılır. |
media |
media query |
|
nohref |
value |
HTML5 tarafından desteklenmiyorHerhangi bir alanla ilgili bir bağlantı olmadığını belirtmek için kullanılır. |
rel |
alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag |
Bulunduğumuz sayfayla bağlantı oluşturduğumuz sayfa arasındaki ilişkiyi bitirmek için kullanılır. |
shape |
default
rect
circle
poly |
Resim haritasında kullanacağımız şekli belirtmek için kullanılır |
shape |
default
rect
circle
poly |
Resim haritasında kullanacağımız şekli belirtmek için kullanılır |
target |
_blank
_parent
_self
_top
framename |
Bağlantı oluşturulan sayfanın nerede açılacağını belirtir. |
type |
media_type |
Bağlantı oluşturulan sayfanın MIME tipini belirlemek için kullanılır. |