HTML <area> coords 属性

Tanda <area> HTML

Definisi dan penggunaan

Properti coords Properti menentukan koordinat area di peta gambar klien.

Properti coords Properti dengan Properti shape Digunakan bersama untuk menentukan ukuran, bentuk dan lokasi area.

Petunjuk:Koordinat kiri atas area adalah 0,0.

Perhatian:Jika koordinat di tag area yang satu terjadi tumpang tindih dengan area lain, akan dipilih terlebih dahulu tag area yang muncul pertama. Peramban akan mengabaikan koordinat di luar batas gambar.

Contoh

Gunakan properti coords untuk menentukan koordinat setiap area di peta gambar klien:

<map name="planetmap">
<area shape="rect" coords="0,0,114,576" href="sun.htm" alt="Sun">
<area shape="circle" coords="190,230,5" href="mercur.htm" alt="Mercury">
<area shape="circle" coords="228,230,5" href="venus.htm" alt="Venus">
</map>

Coba sendiri

Sintaks

<area coords="value">

Nilai properti

Nilai Deskripsi
x1,y1,x2,y2 Tentukan koordinat kiri atas dan kanan bawah kotak (shape="rect").
x,y,radius Tentukan koordinat pusat dan jari-jari lingkaran (shape="circle").
x1,y1,x2,y2,...,xn,yn

Tentukan koordinat sisi poligon.

Jika pasangan koordinat pertama dan terakhir tidak sama, peramban akan menambahkan pasangan koordinat terakhir untuk menutup poligon (shape="poly").

Penjelasan detil:

Properti coords tag <area> mendefinisikan koordinat area yang sensitif mouse di peta gambar klien. Angka koordinat dan makna mereka tergantung dari bentuk area yang ditentukan oleh properti shape.

Berikut adalah nilai yang sesuai untuk setiap bentuk:

Lingkaran: shape="circle", coords="x,y,z"

Di sini x dan y mendefinisikan lokasi pusat lingkaran (koordinat "0,0" adalah koordinat paling atas kiri gambar), r adalah jari-jari lingkaran dalam satuan piksel.

Poligon: shape="polygon", coords="x1,y1,x2,y2,x3,y3,..."

Tiap pasangan koordinat "x,y" mendefinisikan puncak dari poligon satu (koordinat "0,0" adalah koordinat paling atas kiri gambar). Untuk mendefinisikan segitiga paling sedikit memerlukan tiga pasang koordinat; poligon yang tinggi memerlukan jumlah puncak yang lebih banyak.

Poligon akan otomatis ditutup, jadi tidak perlu mengulangi koordinat pertama di akhir daftar untuk menutup seluruh area.

Segi empat: shape="rectangle", coords="x1,y1,x2,y2"

Koordinat pertama adalah koordinat ujung sudut segi empat, pasangan koordinat lain adalah ujung sudut yang berlawanan, "0,0" adalah koordinat sudut kanan atas gambar. Perhatikan bahwa definisi segi empat adalah metode yang disederhanakan untuk mendefiniskan poligon yang memiliki empat ujung.

Contoh, bagian XHTML di bawah ini di bagian kanan bawah kuartal keempat gambar 100x100 pixel menentukan area yang sensitif terhadap mouse, dan menentukan area lingkaran di tengah gambar.

<map name="map">
  <area shape="rect" coords="75,75,99,99" nohref="nohref">
  <area shape="circ" coords="50,50,25" nohref="nohref">
</map>

Dukungan peramban

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Dukungan Dukungan Dukungan Dukungan Dukungan

Tanda <area> HTML