一、HTML中的<usemap>和<map>、<area>：
HTML中的<map>元素用于定義熱點區域，通過給一幅圖像定義熱點區域，在用戶點擊不同的區域后會觸發不同的反應。請看下面的例子
<html>
<body>
<p>
Click on one of the planets to watch it closer:
</p>
<img src="planets.gif" width="145" height="126" usemap="#planetmap">
<map id="planetmap" 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>
<p><b>Note:</b> The "usemap" attribute in the img element refers to the "id" or "name" (browser dependant) attribute in
the map element, therefore we have added both the "id" and "name" attributes to the map element.</p>
</body>
</html>
上面的例子中首先為圖片planets.gif指定了熱點區域planetmap(通過屬性usemap="#planetmap"指定)，接著通過<map>元素定義了熱點區域(通過id="planetmap"使用)。最后在<area>元素中定義了各個熱點的坐標，以及鏈接地址。
當我們把鼠標移到到熱點定義的區域內時，我們可以在瀏覽器的狀態欄上看到不同的URL鏈接地址。
二、HTML中的<ismap>：
HTML中的<ismap>元素使到表單提交時，會在URL后面接上一對以","分隔的數值，如index.htm?60,60。
<html>
<body>
<p>
Move the mouse over the image, and look at the status bar to see how the
coordinates change.
</p>
<p>
<a href="tryhtml_ismap.htm">
<img src="planets.gif" ismap width="146" height="126">
</a>
</p>
</body>
</html>
當我們把鼠標移到到圖像的不同位置時，我們可以在瀏覽器的狀態欄上看到在URL后面帶有一對數值，以逗號分隔。
-------------------------------------------------------------
生活就像打牌，不是要抓一手好牌，而是要盡力打好一手爛牌。
posted on 2008-06-16 22:17
Paul Lin 閱讀(450)
評論(0) 編輯 收藏 所屬分類:
Web基礎