HTML超鏈接標記5.2.3熱區鏈接標記_第1頁
HTML超鏈接標記5.2.3熱區鏈接標記_第2頁
HTML超鏈接標記5.2.3熱區鏈接標記_第3頁
HTML超鏈接標記5.2.3熱區鏈接標記_第4頁
HTML超鏈接標記5.2.3熱區鏈接標記_第5頁
已閱讀5頁，還剩2頁未讀， 繼續免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

5.2.3熱區鏈接標記<map>和<area>一張圖片中的不同區域可以設置不同的超鏈接，以鏈接到不同的目標，這些區域稱為熱區。熱區鏈接需要先設置圖像標記<img>的usemap屬性，定義熱區名稱；再用<map>標記和<area>標記實現熱區的每個分區劃分<map>標記是雙標記，<area>標記是單標記。5.2.3熱區鏈接標記<map>和<area>實現熱區鏈接的基本語法格式如下。<imgsrc="圖片URL"usemap="#熱區名稱"><mapname="熱區名稱"><areashape="熱區形狀1"coords="區域坐標"href="鏈接目標"alt="提示文字"><areashape="熱區形狀2"coords="區域坐標"href="鏈接目標"alt="提示文字">……</map>5.2.3熱區鏈接標記<map>和<area>屬性shape設置熱區形狀，屬性值可以為rect（矩形）、circle（圓形）、poly（多邊形）三種。屬性Coords設置熱區區域的劃分坐標。如果熱區形狀是rect(矩形)，坐標依次為矩形左上角的水平坐標、左上角的垂直坐標和右下角的水平坐標、右下角的垂直坐標。如果熱區形狀是circle（圓形），坐標依次為圓心的水平坐標、圓心的垂直坐標和半徑值，單位為像素。如果熱區形狀是poly（多邊形），坐標依次為多邊形各頂點的水平坐標、垂直坐標。屬性alt設置熱區的提示文字，當鼠標移動到熱區上時，會顯示提示文字。5.2.3熱區鏈接標記<map>和<area>例5-3熱區鏈接示例。示例代碼（5-3.html）如下。<imgsrc="images/tuxing.jpg"width="441"height="303"usemap="#Map"><mapname="Map"><areashape="rect"coords="64,92,139,146"href="5-3jx.html"><areashape="rect"coords="216,92,271,149"href="5-3jx.html"><areashape="circle"coords="357,255,27"href="5-3yx.html"><areashape="poly"coords="139,232,166,275,69,275"href="5-3dbx.html"><areashape="poly"coords="332,98,415,97,387,144,303,145"href="5-3dbx.html"><areashape="poly"coords="221,231,254,230,272,279,205,279"href="5-3dbx.html"></map>5.2.3熱區鏈接標記<map>和<area>圓形熱區鏈接目標示例代碼（5-3yx.html）如下。其余熱區鏈接目標示例代碼類似。<html><head><metahttp-equiv="Content-type"Content="text/HTML;charset=UTF-8"/><title>例5-3熱區鏈接示例</title></head><body>這是一個圓形。</body></html>5.2.3熱區鏈接標記<map>和<area>瀏覽器中5-3.html網頁顯示效果

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論