HTML <area> Etiketi
HTML <area> etiketi, görüntü haritası içerisindeki köprülerle ilişkilendirilen tıklanabilir veya etkin alanlar tanımlar. Bu alanlara tıklarsanız resim veya bir URL açılır. Bu etiket her zaman <map> öğesiyle birlikte kullanılır.
Bir resim haritası içerisinde, tek bir <map> kullanılarak birden fazla <area> öğesi tanımlanabilir. Bu <area> ögeleri faklı konumlara köprülenebilir.
HTML <area> elemanı şekil ve kodlarla tanımlanır . Shape özelliği, dikdörtgen , daire , kare ve çokgen gibi bir alan belirtir. Coords niteliği görüntünün içindeki alanların koordinatlarını belirtir.
Görüntü haritası, aktif alanlara sahip grafiksel bir görüntüdür Bir görüntü haritası tanımlamak için aşağıdakileri gerektirir:
- Geçerli bir harita adı tanımlayan usemap özelliğine sahip bir HTML <img> öğesi gerekir.
- HTML değeri <map> öğesi , değeri usemap ile aynı olması gereken name niteliğine sahip olması gerekir.
- Bir resim haritasında tıklanabilir alanlar oluşturan <map> öğesinin içindeki bir veya daha fazla <area> ögesi olmalıdır.
Söz dizimi:
<area shape="" coords="" href="">
Özellikleri:
| Görüntüleme | Etiketi Başlat/ Etiketi Bitir | Kullanımı |
| Blok | Başlangıç ve Bitiş | Görüntü Haritası |
Örnek:
<!DOCTYPE html>
<html>
<head>
<title>HTML Area Kullanımı</title>
<style>
body{
margin-left: 250px;}
</style>
</head>
<body>
<h2>HTML area kullanım örneği</h2>
<img src="" usemap="#web">
<map name="web">
<area shape="rect" coords="66,117,131,168" href="">
<area shape="poly" coords="199,36,277,85" href="">
<area shape="circle" coords="330,107,406,159" href="">
<area shape="rect" coords="199,185,267,236" href="">
</map>
</body>
</html>
Özel Kullanımlar:
| Özellik | Değer | Açıklama | ||||||||
| Alternatif Metin(alt) | Metin(Text) | Görüntülenemezse tarayıcıda alternatif bir metin oluşturur. | ||||||||
| Coords |
|
|
||||||||
| Href | href | Aktif alan için bir köprü oluşturur. | ||||||||
| Hedef(target) | Bağlantıların açılacağı pencereleri tanımlar. | |||||||||
| Şekil(shape) |
|
|
||||||||
| İndirme(download) | dosya adı | Kaynağı indirmek için kullanılan köprüyü tanımlar. | ||||||||
| rel | yazar,tag vb. | Bağlantılı belgeler arasındaki ilişkiyi tanımlar. | ||||||||
| hreflang | dil kodu | Bağlı kaynağın dilini belirtir. | ||||||||
| tip(type) | Ortam Türü | Bağlı kaynağın MIME türünü belirtir. HTML 5’te desteklenmez. |
Tarayıcı Desteği:
Kimler Neler Demiş?