HTML <img> usemap attribute

HTML <img> 标籤

Definition and Usage

usemap attribute defines the image as a client-side image map.

Image mapping refers to an image with clickable areas.

usemap attributes are related to <map> element associated with the name or id attribute to establish a relationship between <img> and <map>.

Note:Cannot be used if the <img> element is a descendant of an <a> or <button> element usemap properties.

Malawak na Pagbabasa: Detalyadong Paglalarawan ng Usemap Attribute

Example

Image mapping with clickable areas:

<img src="life.png" alt="Life" usemap="#lifemap" width="650" height="451">
<map name="lifemap">
  <area shape="rect" coords="10,208,155,338" alt="Computer" href="airpods.html">
  <area shape="rect" coords="214,65,364,365" alt="Phone" href="iphone.html">
  <area shape="circle" coords="570,291,75" alt="Cup of coffee" href="coffee.html">
</map>

Subukan Ngayon

Pagsusuri

<img usemap="#mapname">

Halaga ng Attribute

Halaga Paglalarawan
#mapname Ang tanda ng pambungad ng ("#") kasama ang pangalan ng naaangkop na <map> element.

Malawak na Pagbabasa: Detalyadong Paglalarawan ng Usemap Attribute

usemap Ang attribute ay nagbibigay ng isang "client-side" na image mapping mechanism, epektibong inaalis ang paggamit ng server-side sa paghawak ng mouse coordinates, at sa mga problema sa pagkaunlad ng network dahil dito. Sa pamamagitan ng mga espesyal na <map> at <area> tag, ang HTML taggagawa ay makakapagbigay ng isang paglalarawan ng koordinado ng mga sensitive area ng hyperlink sa image na ginamit sa usemap, na kasama ang naaangkop na URL ng hyperlink. Ang halaga ng usemap attribute ay isang URL, na inililagay sa espesyal na <map> area. Ang browser ng kompyuter ng user ay magpalit ng koordinado ng mouse na tinatamaan sa imahen sa partikular na pagkilos, kasama ang paglulista at pagpapakita ng isa pang dokumento.

Sa amin na palagay, magpakita namin ang mga salin, ang sumusunod na pinagmulang kodigo ay naglalarawan ng isang 100x100 pixel na imaheng map.gif na pinagmanggagamit bilang apat na lugar, kapag tinatamaan ng user ang anumang lugar nito, ito ay naugnay sa iba't ibang dokumento. Pansin na, sa pangalawang <img> tag, naipakita namin ang epektibong paglalagay ng paggamit ng ismap image mapping, kaya ang mga user na gumagamit ng browser na walang usemap na paggamit, ay maaaring gumamit ng isa pang paraan, na ang mekanismo ng server-side, upang pamahalaan ang image mapping:

<a href="/example/map">
  <img src="/i/map.gif" ismap="ismap" usemap="#map" />
</a>
<map name="map">
  <area coords="0,0,49,49" href="link1.html">
  <area coords="50,0,99,49" href="link2.html">
  <area coords="0,50,49,99" href="link3.html">
  <area coords="50,50,99,99" href="link4.html">
</map>

ความแตกต่างในการใช้ ismap และ usemap

แผนที่เป็นตัวอย่างที่ดีของการใช้อาทิตย์ ismap และ usemap โดยตัวอย่าง ในขณะที่คุณกำลังเข้าถึงเว็บไซต์ของบริษัทใหญ่ทั่วประเทศ ผู้ใช้อาจคลิกเมืองที่พวกเขาอาศัยอยู่บนแผนที่เพื่อขอรับที่อยู่และหมายเลขโทรศัพท์ของร้านขายสินค้าใกล้เคียง

ข้อดีของการใช้ usemap ในบริการลูกค้าสำหรับการจัดการแผนที่รูปภาพ คือมันไม่ต้องการมีเซิร์ฟเวอร์หรือซอฟต์แวร์เซิร์ฟเวอร์พิเศษ ต่างจากกลไก ismap มันสามารถใช้ในสภาพที่ไม่มีเครือข่าย (no network) อย่างเช่นใช้ในไฟล์ท้องถิ่นหรือ CD-ROM

การสนับสนุนโปรแกรมนี้

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน

HTML <img> 标籤