HTML圖像的熱區(qū)鏈接知識(shí)及實(shí)例代碼.doc

HTML圖像的熱區(qū)鏈接知識(shí)及實(shí)例代碼除了對(duì)整幅圖像設(shè)置超鏈接外，還可以將圖像劃分為若干區(qū)域，這叫做熱區(qū)，每個(gè)區(qū)域可設(shè)置不同的超鏈接。此時(shí)，包含熱區(qū)的圖像可以稱為映射圖像。要進(jìn)行熱區(qū)設(shè)置，首先需要在圖像文件中設(shè)置映射圖像名，格式為： 也就是說，此時(shí)需要使用標(biāo)記的usemap屬性，定義圖像的映射圖像名。然后，就要在圖像中定義各個(gè)熱區(qū)以及超鏈接了，主要語法為： 在該語法中又引入了兩個(gè)標(biāo)記：和。、標(biāo)記用于包含多個(gè)標(biāo)記，其中的映射圖像名稱就是在標(biāo)記中定義的名稱。標(biāo)記則用于定義各個(gè)熱區(qū)和超鏈接，它有兩個(gè)重要屬性：（1）shape屬性：用來定義熱區(qū)形狀，它有三個(gè)值：default：默認(rèn)值，為整幅圖像。rect：矩形區(qū)域。circle：圓形區(qū)域。poly：多邊形區(qū)域。（2）coords屬性：用來定義矩形、圓形或多邊形區(qū)域的坐標(biāo)。它的格式如下：如果shape = rect，則coords包含四個(gè)參數(shù)，分別為left、top、right和bottom，也可以將這四個(gè)參數(shù)看成矩形左上角和右下角頂點(diǎn)的坐標(biāo)。如果shape = circle，則coords包含三個(gè)參數(shù)，分別為center-x、center-y和radius，這三個(gè)參數(shù)是圓心坐標(biāo)和圓的半徑。如果shape = poly，則coords需要按順序取多邊形各個(gè)頂點(diǎn)的（x、y）坐標(biāo)值，因此形式為x1, y1, x2, y2, xn, yn?？梢允悄鏁r(shí)針，也可以是順時(shí)針。HTML會(huì)按照定義頂點(diǎn)的順序?qū)⑺鼈冩溄悠饋?，形成多邊形熱區(qū)。如果要定義的熱區(qū)形狀復(fù)雜，都可以用多邊形熱區(qū)來逼近，所以如果shape = poly，則coords可能包含很多坐標(biāo)值，其數(shù)量必須是偶數(shù)。圖像的左上角坐標(biāo)是（0, 0），x軸向右、y軸向下為正?！纠?】修改例6，改為chap7_7.html，給圖像定義熱區(qū)并加超鏈接。 itsway - 圖像 在圖中請(qǐng)注意，當(dāng)鼠標(biāo)移到熱點(diǎn)區(qū)域時(shí)，鼠標(biāo)會(huì)變成手的形狀，此時(shí)單擊鼠標(biāo)，就會(huì)打開相應(yīng)的網(wǎng)頁。“黿頭渚”念“原頭煮”，是無錫太湖的一處名勝，呵呵。在chap7_7.html中鏈接了幾個(gè)網(wǎng)頁，它們可以簡單寫寫。例如，chap7_7meiyuan.html代碼如下。 itsway - 圖像 無錫梅園橫山風(fēng)景區(qū)南臨太湖，北倚龍山，成為集自然景觀、人文古跡、名花異卉、園林建筑及休閑健身于一體的著名旅游勝地。四面有山皆入畫，一年無日不看花。 chap7_7yuantouzhu.html代碼如下： itsway - 圖像 黿頭渚是無錫第一勝景、太湖佳絕處，獨(dú)占太湖風(fēng)景最美一角，山清水秀。郭沫若吟道：太湖佳絕處，畢竟在黿頭。黿頭渚的特點(diǎn)是以太湖風(fēng)景為主，人工修飾為輔，依山傍湖，別具情趣，是觀賞太湖的理想所在。 chap7_7piaomiaofeng.html代碼如下： itsway - 圖像 太湖西山縹緲峰，海拔337米，為太湖七十二峰之首，水的精華所在。太湖風(fēng)云多變，山峰常隱于云霧之中，縹縹緲緲，似仙山隔云海，如霞嶺玉帶連，有縹緲晴巒景觀，為西山八大勝景之一。 html圖像地圖詳細(xì)講解 圖像標(biāo)簽標(biāo)簽屬性：src=圖像數(shù)據(jù)alt圖像說明(鼠標(biāo)懸浮）align對(duì)齊方式(align= )border圖像邊框?qū)挾葁idth與height圖像的寬度和高度（如果沒有標(biāo)出數(shù)值則按原始大小顯示）標(biāo)簽的顯示過程分析：一個(gè)靜態(tài)WEB服務(wù)器是如何借標(biāo)簽來收集其他WEB站點(diǎn)的計(jì)數(shù)器（圖片）的呢？如：水平線標(biāo)簽屬性：size:水平線粗細(xì)color:水平線顏色width:水平線橫寬noshade:水平線陰影效果1：圖像超鏈接格式為：2:什么是圖像地圖把一幅圖像分成多個(gè)區(qū)域，每個(gè)區(qū)域指向不同的URL地址，比如，將一幅中國地圖的圖像按省市劃分成若干區(qū)域，這些區(qū)域被稱為熱點(diǎn)，單擊熱點(diǎn)區(qū)域，就可以鏈接到與相應(yīng)省市有關(guān)的頁面，這就是圖像地圖.3:怎樣產(chǎn)生圖像地圖?(1) 首先必須定義出圖像上的各個(gè)熱點(diǎn)區(qū)域的形狀,位置坐標(biāo),及其指向地url地址等信息,這個(gè)過程叫圖像熱點(diǎn)映射,圖像熱點(diǎn)映射需要使用標(biāo)簽對(duì)進(jìn)行說明,其中的name屬性為該圖像熱點(diǎn)映射指定了一個(gè)名稱.(2) 圖像熱點(diǎn)映射中的各個(gè)區(qū)域用標(biāo)簽說明,標(biāo)簽的格式為:.href部分也可以用nohref替換,表示在該區(qū)域單擊鼠標(biāo)無效.標(biāo)簽還可以有一格Target屬性,用來指明瀏覽器在那個(gè)窗口或貞中顯示href屬性所指向的網(wǎng)頁資源.(3)在定義好了圖像熱點(diǎn)映射后，接著就要在圖像標(biāo)簽中增加一個(gè)名為usemap的屬性設(shè)置,usmap屬性指定該圖像被用作圖像地圖,其設(shè)置值為所使用的圖像熱點(diǎn)映射名稱,格式為:在標(biāo)簽的屬性設(shè)置值前多加一個(gè)#字符.例如:-例子:定義圖像地圖的過程:-圖像地圖熱點(diǎn)區(qū)域形狀(shape)舉例:shqpe屬性的設(shè)置說明:rect 定義一個(gè)矩形區(qū)域,coords屬性設(shè)置值為矩形的左上角,右下角的坐標(biāo),各個(gè)坐標(biāo)值之間用逗號(hào)