La etiqueta HTML <map> se utiliza para definir mapas de imágenes en HTML. Las áreas dentro de la imagen en las que se puede hacer clic se definen mediante la etiqueta <area> .
Sintaxis:
<map name="map-name">
Valor de atributo:
- nombre: Se utiliza para asociar el mapa con la imagen en la que se utiliza.
Nota: El atributo de nombre en el mapa debe tener el mismo valor que el atributo de mapa de uso de la imagen .
Ejemplo: En este ejemplo, el área resaltada es el área mapeada, al hacer clic en ella se accede al sitio web.
HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content= "width=device-width, initial-scale=1.0"> </head> <body> <img src= "https://media.geeksforgeeks.org/wp-content/uploads/array-2.png" alt="gfgimage" usemap="#mapID"> <map name="mapID"> <area shape="rect" coords="34, 44, 270, 350" href="https://www.geeksforgeeks.org/data-structures/?ref=shm"> </map> </body> </html>
Producción:
Publicación traducida automáticamente
Artículo escrito por manishkrjha y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA