img usemap atribut China map link_HTML/Xhtml_web page production-html tutorial-php.cn

img usemap atribut China map link_HTML/Xhtml_web page production

WBOY

Lepaskan： 2016-05-16 16:42:54

asal

2558 orang telah melayarinya

Teg img html: mentakrifkan imej yang akan diperkenalkan dalam halaman web. Ia juga mempunyai atribut usemap yang sangat menarik.
Lihat peta di laman utama 51ditu, dan terdapat peta China di tengah. Klik kanan untuk memuat turun dan lihat gambar biasa.
Tetapi mengklik pada wilayah pada peta boleh mencetuskan acara yang berbeza (atau membuka pautan yang berbeza), yang sangat menarik. Ternyata atribut usemap digunakan.
Sudah tentu anda juga perlu menentukan tag peta. Keseluruhan kod adalah seperti berikut:

<html>
<kepala>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<tajuk>img atribut peta guna</title>
</head>
  
<badan>
       
    <img src="http://img.jb51.net/maps/chinamap.gif" usemap="#Map" border="1"/>
       
    <nama peta="Peta" class="maparea">
        <bentuk kawasan="rect" coords="73,87,103,104" href="javascript:alert('Xinjiang')">
        <bentuk kawasan="rect" coords="144,125,173,142" href="javascript:alert('Qinghai')">
        <bentuk kawasan="rect" coords="84,158,115,175" href="javascript:alert('Tibet')">
        <bentuk kawasan="rect" coords="220,90,257,105" href="javascript:alert('Inner Mongolia')">
        <bentuk kawasan="rect" coords="348,45,389,61" href="javascript:alert('Heilongjiang')">
        <bentuk kawasan="rect" coords="346,68,371,83" href="javascript:alert('Jilin')">
        <bentuk kawasan="rect" coords="323,84,351,100" href="javascript:alert('Liaoning')">
        <bentuk kawasan="rect" coords="298,100,326,114" href="javascript:alert('Tianjin')">
        <bentuk kawasan="rect" coords="288,120,314,136" href="javascript:alert('Shandong')">
        <bentuk kawasan="rect" coords="268,107,295,121" href="javascript:alert('Hebei')">
        <bentuk kawasan="rect" coords="207,116,235,130" href="javascript:alert('Ningxia')">
        <bentuk kawasan="rect" coords="186,162,214,179" href="javascript:alert('Sichuan')">
        <bentuk kawasan="rect" coords="256,142,281,157" href="javascript:alert('Henan')">
        <bentuk kawasan="rect" coords="305,144,332,159" href="javascript:alert('Jiangsu')">
        <bentuk kawasan="rect" coords="320,162,342,177" href="javascript:alert('Shanghai')">
        <bentuk kawasan="rect" coords="216,168,243,185" href="javascript:alert('Chongqing')">
        <bentuk kawasan="rect" coords="250,162,277,177" href="javascript:alert('Hubei')">
        <bentuk kawasan="rect" coords="283,161,308,177" href="javascript:alert('Anhui')">
        <bentuk kawasan="rect" coords="213,196,239,209" href="javascript:alert('Guizhou')">
        <bentuk kawasan="rect" coords="243,183,269,198" href="javascript:alert('Hunan')">
        <bentuk kawasan="rect" coords="273,185,299,200" href="javascript:alert('Jiangxi')">
        <bentuk kawasan="rect" coords="308,177,334,193" href="javascript:alert('Zhejiang')">
        <bentuk kawasan="rect" coords="179,210,204,225" href="javascript:alert('Yunnan')">
        <bentuk kawasan="rect" coords="227,214,252,228" href="javascript:alert('Guangxi')">
        <bentuk kawasan="rect" coords="231,248,257,263" href="javascript:alert('Hainan')">
        <bentuk kawasan="rect" coords="292,200,319,214" href="javascript:alert('Fujian')">
        <bentuk kawasan="rect" coords="259,219,287,231" href="javascript:alert('Guangdong')">
        <bentuk kawasan="rect" coords="244,231,270,246" href="javascript:alert('Macau')">
        <bentuk kawasan="rect" coords="276,232,304,248" href="javascript:alert('Hong Kong')">
        <bentuk kawasan="rect" coords="311,228,338,243" href="javascript:alert('Taiwan')">
        <bentuk kawasan="rect" coords="272,90,302,107" href="javascript:alert('Beijing')">
        <bentuk kawasan="rect" coords="196,130,222,145" href="javascript:alert('Gansu')">
        <bentuk kawasan="rect" coords="246,116,272,130" href="javascript:alert('Shanxi')">
        <bentuk kawasan="rect" coords="224,136,252,151" href="javascript:alert('Shaanxi')">
    </peta>
</badan>
</html>

Petua: Anda boleh mengubah suai sebahagian daripada kod sebelum menjalankan
Informationen zur Bedeutung mehrerer Attribute des Bereichs-Tags im Karten-Tag finden Sie unter: http://www.w3school.com.cn/tags/tag_area.asp

Es ist besser, sich das zu notieren Formattribut der Fläche, das optional ist. Es gibt Rechtecke, Kreise und Polygone. Besonderes Augenmerk sollte auf das Attribut coords gelegt werden, das in Verbindung mit der Form verwendet werden muss. Die Koordinaten der oberen linken Ecke des Bildes sind „0,0“.