ແບບ HTML <map> ຕາມລະບຽບ

  • ບ່ອນໄປຫຼັງ <main>
  • ບ່ອນໄປຕໍ່ໄປ <mark>

ການສະແດງ ແລະ ການນໍາໃຊ້

<map> ແຕ່ລະປະກອບຕ້ອງມີກົດຢ່າງເພື່ອກຳນົດພາບທີ່ມີມາບາບ. ພາບທີ່ມີມາບາບ (image map) ແມ່ນພາບທີ່ມີພື້ນພິມບັນນາທິການ.

<map> ຕົວເອກະສານ ປະສົມເປັນທີ່ມີປະສົມເປັນ <img> ປະກອບ ປະສົມເປັນ ກ່ຽວຂ້ອງກັບພາບແລະມາບາບ.

<map> ສຳນັກງານຫຼາຍຢ່າງ: <area> ປະກອບ,ກຳນົດພື້ນພິມບັນນາທິການໃນພາບທີ່ມີມາບາບ.

ບໍ່ບໍ່ບັນທຶກ:

ຄູ່ມື HTML DOM:ໂອບເມັພໂພ ແມັດໃບ

ຄວາມຈິງ

ຕົວຢ່າງ 1

ພາບທີ່ມີພື້ນພິມບັນນາທິການສາຍຜູ້ຄົນ:

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

ທົດລອງດ້ວຍຕົວຕົນ

ຕົວຢ່າງ 2

ອີກພາບທີ່ມີພື້ນພິມບັນນາທິການສາຍຜູ້ຄົນ:

<img src="solarsystem.png" width="1024" height="576" alt="Planets" usemap="#planetmap">
<map name="planetmap">
  <area shape="rect" coords="0,0,114,576" alt="Sun" href="sun.html">
  <area shape="circle" coords="190,230,5" alt="Mercury" href="mercury.html">
  <area shape="circle" coords="228,230,5" alt="Venus" href="venus.html">
</map>

ທົດລອງດ້ວຍຕົວຕົນ

ປະເພດ

ປະເພດ ຄວາມລວມ ການອະທິບາຍ
name ຊື່ພາບການດັນການ ຕ້ອງການ. ກໍານົດຊື່ຂອງພາບການດັນການ.

ປະສົມປະກອບ ທົດສະພາບທົດສະພາບ

<map> ປະເພດຍັງສະໜັບສະໜູນ ປະສົມປະກອບ ທົດສະພາບທົດສະພາບ HTML.

ປະສົມປະກອບ ອາສາລະການ

<map> ປະເພດຍັງສະໜັບສະໜູນ ປະສົມປະກອບ ອາສາລະການ HTML.

ການປະກາດ CSS ຄົງທີ່

ບັນດາຄົນໃຊ້ທົດສະພາບທົດສະພາບຈະສະແດງກັບຄວາມພົບໄດ້ລົງມານີ້: <map> ປະເພດ:

map {
  display: inline;
}

ການສະໜັບສະໜູນບັນດາຄົນໃຊ້

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ ສະໜັບສະໜູນ
  • ບ່ອນໄປຫຼັງ <main>
  • ບ່ອນໄປຕໍ່ໄປ <mark>