Image Map di HTML

Apa Itu Image Map?

Image map adalah teknik HTML yang memungkinkan bagian-bagian gambar memiliki tautan yang berbeda. Fitur ini sangat berguna, misalnya, untuk membuat peta interaktif atau membagi satu gambar besar menjadi beberapa bagian yang dapat diklik.

Cara Kerja Image Map

1. Untuk membuat image map, kita bisa membuat dengan mengunjungi website image-map.net 


2. Kita bisa memilih foto yang akan kita buat image map setelah itu edit gambar dengan  Jenis Shape yang Tersedia seperti rect,circle dan poly


3. Kalau sudah tekan tunjukan kode dan salin di Visual Studio Code



4. Masukkan source code yang di dapat sebelumnya ke dalam file index.html


5. Buat file r7.html untuk menampilkan Cristiano Ronaldo


6. Buat file eth.html untuk menampilkan Erik Ten Hag

Hasil Akhir dari Gambar Interaktif Image Map




Link GitHub : https://github.com/hxllxl-star/MATERI-6








Komentar