jquery - 如何使用 css 定位 html 区域 map

Question

我想用 CSS 隐藏这个区域 map 。如何在不向其或周围添加额外元素的情况下做到这一点？

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

Answer 1

可以单独使用pointer-events(Firefox不采用map和area标签的显示规则)

/* use the selector of your needs : 
img[usemap] or img[usemap="#planetmap"]
*/
img {
  pointer-events:none;
  }

<img src="http://www.w3schools.com/tags/planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<h1>map is disabled</h1>
<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>