W3School TIY Editor

<!DOCTYPE html>
<html>
<body>

<h1>map 和 area 元素</h1>

<p>请单击太阳或其中一颗行星，近距离观察它们：</p>

<img src="/i/planets/solarsystem.png" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
<area shape="rect" coords="0,0,114,576" href ="/demo/planets/sun.html" alt="Sun" />
<area shape="circle" coords="190,230,5" href ="/demo/planets/mercury.html" alt="Mercury" />
<area shape="circle" coords="228,230,5" href ="/demo/planets/venus.html" alt="Venus" />
<area shape="circle" coords="279,230,5" href ="/demo/planets/earth.html" alt="Earth" />
<area shape="circle" coords="324,230,5" href ="/demo/planets/mars.html" alt="Mars" />
<area shape="circle" coords="413,231,55" href ="/demo/planets/jupiter.html" alt="Jupiter" />
<area shape="circle" coords="569,232,45" href ="/demo/planets/saturn.html" alt="Saturn" />
<area shape="circle" coords="669,232,20" href ="/demo/planets/uranus.html" alt="Uranus" />
<area shape="circle" coords="735,232,20" href ="/demo/planets/neptune.html" alt="Neptune" />
<area shape="circle" coords="345,361,5" href ="/demo/planets/ceres.html" alt="Ceres" />
<area shape="circle" coords="786,361,5" href ="/demo/planets/pluto.html" alt="Pluto" />
<area shape="circle" coords="854,361,5" href ="/demo/planets/eris.html" alt="Eris" />
</map>

<p>请细心研究！除了八大行星，您还有机会找到太阳系内的三颗矮行星，尽情享受您的太空探索之旅吧：）</p>

</body>
</html>