IMG Usemap Attribut China Map Lien

Auteur：Eve Cole Date de mise à jour：2025-05-06 09:16:01

La balise IMG de HTML: définit une image à introduire dans une page Web. Il a également un attribut Usemap qui est très intéressant.

Regardez une carte sur la page d'accueil 51ditu et une carte de la Chine au milieu. Cliquez avec le bouton droit pour le télécharger et voir une image normale.

Mais cliquer sur les provinces sur la carte peut commencer différents événements (ou ouvrir différents liens), ce qui est très intéressant. Il s'avère que l'attribut UseMap est utilisé.

Bien sûr, vous devez également définir une étiquette de carte. L'ensemble du code est le suivant:

<html> <éad- head> <meta http-equiv = "content-type" contenu = "text / html; charset = gbk"> <ititle> img usemap attribut </ title> </ head> <body> <img src = "http://img.vevb.com/Maps/chinamap.gif" usemAP = "# map <zone forme = "rect" coords = "73,87,103,104" href = "javaScript: alert ('xinjiang')"> <aire forme = "rect" coords = "144,125,173,142" href = "javascript: alert ('qinghai')"> <area shape = "rct" coords = "84.158,115,175" href = "javascript: alert ('tibet')"> <zone shape = "recct" coords = "220,90,257,105" href = "javascrip href = "JavaScript: alert ('heilongjiang')"> <zone forme = "rect" coords = "346,68,371,83" href = "javascript: alert ('jilin')"> <area forme = "rect" coords = "323,84,351,100" href = "JavaScript: alert ('liaoning')"> <area forme = "rect" coords = "298,100,326,114" href = "javascrip <zone forme = "rect" coords = "268,107,295,121" href = "javaScript: alert ('hebei')"> <aire forme = "rect" coords = "207,116,235,130" href = "javascript: alert ('ningxia')"> <area forme = "rct" coords = "186,162,214,179" href = "javascript: alert ('sichuan')"> <area forme = "rect" coords = "256,142,281,157" href = "javascript: alert ('Henan')"> <coin Face = "RECT" coords = "305,144,332, <ares href = "javascript: alert ('jiangsu')"> <zone forme = "rect" coords = "320,162,342,177" href = "javascript: alert ('shanghai')"> <area forme = "rect" coords = "216,168,243,185" " href = "JavaScript: alert ('chongqing')"> <zone forme = "rect" coords = "250,162,277,177" href = "javascript: alert ('hubei')"> <area forme = "rect" coords = "283,161,308,177" " href = "JavaScript: alert ('anhui')"> <zone forme = "rect" coords = "213,196,239,209" href = "JavaScript: alert ('Guizhou')"> <area forme = "rect" coords = "243,183,269,198" " href = "JavaScript: alert ('hunan')"> <area forme = "rect" coords = "273,185,299,200" href = "JavaScript: alert ('jiangxi')"> <zone forme = "rect" coords = "308,177,334,193" " href = "JavaScript: alert ('zhejiang')"> <zone forme = "rect" coords = "179,210,204,225" href = "javascript: alert ('yunnan')"> <area forme = "rect" coords = "227,214,252228" "" href = "JavaScript: alert ('guangxi')"> <aire forme = "rect" coords = "231,248,257,263" href = "javascript: alert ('hainan')"> <area forme = "rect" coords = "292,200,319214" " href = "JavaScript: alert ('Fujian')"> <zone forme = "rect" coords = "259,219,287,231" href = "JavaScript: alert ('Guangdong')"> <zone forme = "RECT" coords = "244,231,270246" " href = "JavaScript: alert ('macau')"> <zone forme = "rect" coords = "276,232,304,248" href = "JavaScript: alert ('hong kong')"> <zone forme = "rect" coords = "311,228,338,243" href = "JavaScript: alert ('Taiwan')"> <Area Shape = "rect" coords = "272,90,302,107" href = "javascript: alert ('beijing')"> <area forme = "rect" coords = "196,130,222,145" href = "javascript: alert (gansu '> <sone Shape = "REct" coords = "246,116,272,130" href = "javascript: alert ('shanxi')"> <aire forme = "rect" coords = "224,136,252,151" href = "javascript: alert ('shaanxi')"> </aph> </ body> </ html>

Plusieurs significations d'attribut de la balise de zone dans la balise de carte sont les suivantes: http://www.w3school.com.cn/tags/tag_area.asp

Ici, nous noterons également l'attribut de forme de la zone, qui peut être sélectionné à partir des rectangles, des cercles et des polygones. Il est particulièrement important de noter que l'attribut coords doit être utilisé en combinaison avec la forme. Les coordonnées dans le coin supérieur gauche de l'image sont 0,0.