圖像的超鏈接
圖像的鏈接和文字的鏈接方法是一樣的,都是用<a>標(biāo)簽來完成,只要將<img>標(biāo)簽放在<a>和</a>之間就可以了。
語(yǔ)法:<a href="鏈接地址"><img src="圖像文件的地址"></a>
說明:在該語(yǔ)法中,href參數(shù)用來設(shè)置圖像的鏈接地址。
在代碼中加粗部分的標(biāo)記是為圖像添加空鏈接,在瀏覽器中預(yù)覽,當(dāng)鼠標(biāo)指針放置在鏈接的圖像上時(shí),鼠標(biāo)指針會(huì)發(fā)生相應(yīng)的變化。
提示由于使用<a>標(biāo)記,圖像鏈接和文字鏈接相同。創(chuàng)建E-mail鏈接需要將mailto://添加到E-mail地址的前面。鏈接到一個(gè)HTTP站點(diǎn),需要在網(wǎng)址前使用http://協(xié)議。
圖像熱區(qū)鏈接
在HTML中可以把圖片劃分成多個(gè)熱點(diǎn)區(qū)域,每一個(gè)熱點(diǎn)區(qū)域鏈接到不同的網(wǎng)頁(yè)。這種效果的實(shí)質(zhì)是把一幅圖片劃分為不同的熱點(diǎn)區(qū)域,再讓不同的區(qū)域進(jìn)行超鏈接,這就是映射地圖。
語(yǔ)法:首先需要在圖像文件中設(shè)置映射圖像名,在圖像的屬性中使用<usemap>標(biāo)記添加圖像要引用的映射圖像的名稱如下:
< img src="圖像地址" usemap ="映射圖像名稱">
然后需要定義熱區(qū)圖像以及熱區(qū)的鏈接屬性如下:
<map name="映射圖像名稱">
<area shape="熱區(qū)形狀" coords="熱區(qū)坐標(biāo)" href="鏈接地址">
</map>
說明:在該語(yǔ)法中要先定義映射圖像的名稱,然后再引用這個(gè)映射圖像。在<area>標(biāo)記中定義了熱區(qū)的位置和鏈接,其中shape參數(shù)用來定義熱區(qū)形狀,coords參數(shù)則用來設(shè)置區(qū)域坐標(biāo),對(duì)于不同形狀來說,coords設(shè)置的方式也不同。
舉例:選擇菜單中的【文件】|【打開】命令,打開繪制圖像熱區(qū)鏈接的網(wǎng)頁(yè)文檔。
在網(wǎng)頁(yè)中選擇繪制圖像熱區(qū)的圖像,在【屬性】面板中單擊【矩形熱點(diǎn)】工具,按住鼠標(biāo)左鍵不放,拖動(dòng)鼠標(biāo)在繪制熱區(qū)的圖像上繪制一熱點(diǎn)矩形。
選中矩形熱點(diǎn),在【屬性】面板中的【鏈接】文本框中輸入鏈接的目標(biāo)地址。
選中圖像,在【屬性】面板中單擊【橢圓形熱點(diǎn)】工具,按住鼠標(biāo)左鍵不放,拖動(dòng)鼠標(biāo)在繪制熱區(qū)的圖像上繪制一橢圓形熱區(qū)。
選中橢圓形熱點(diǎn),在【屬性】面板中的【鏈接】文本框中輸入鏈接的目標(biāo)地址。
按照步驟4~5的方法,在圖像上其他的位置繪制一個(gè)多邊形熱區(qū),在【屬性】面板中的【鏈接】文本框中輸入鏈接的目標(biāo)地址。
保存文檔,在瀏覽器中預(yù)覽效果。
在代碼中加粗部分的標(biāo)記為設(shè)置熱區(qū)的關(guān)鍵代碼,在這段代碼中設(shè)置了3種不同形狀的熱區(qū),并對(duì)其設(shè)置了熱區(qū)鏈接。在網(wǎng)頁(yè)中,根據(jù)繪制熱區(qū)鏈接圖像形狀的不同,可選擇不同形狀的熱區(qū)工具繪制。使用熱區(qū)可以將網(wǎng)頁(yè)的不同部分鏈接到不同的網(wǎng)頁(yè)。
當(dāng)前文章標(biāo)題:圖像的超鏈接和圖像熱區(qū)鏈接
當(dāng)前URL:http://51zuanshi.com.cn/news/wzzz/3327.html