圖片熱區(qū)詳解 與切片的優(yōu)勢(shì)比較

切片和圖片熱區(qū)是什么？圖片切片是將很大的網(wǎng)頁(yè)圖片，切成類似拼圖的那種形式，之后運(yùn)用 HTML 代碼，再完美的拼接起來的一種加快網(wǎng)頁(yè)圖片顯示的手法，圖片切片之后你還可以在不同的切片上加入鏈接等等，從而達(dá)到點(diǎn)擊不同圖片區(qū)域跳轉(zhuǎn)到不同頁(yè)面的效果。圖片熱區(qū)是在一章圖片上，繪制任意多邊形或者圓形的區(qū)域，并加入鏈接的一種形式，圖片熱區(qū)的好處在于，圖片不用被切割，就算被點(diǎn)擊的區(qū)域是不規(guī)則的形狀，圖片熱區(qū)也可以很輕松的應(yīng)付，而切片要應(yīng)付多邊形的區(qū)域，可能就要求多次切片了，那么切片和圖片熱區(qū)到底有什么具體區(qū)別和優(yōu)勢(shì)呢，兩者又怎樣制作呢，我們今天就來看看圖片熱區(qū)和切片。

區(qū)別

圖片熱區(qū)和切片的區(qū)別在哪里？切片主要是應(yīng)對(duì)網(wǎng)頁(yè)中過大的圖片，將過大的圖片切成拼圖狀態(tài)的一小片，網(wǎng)頁(yè)在打開過程中就可以同時(shí)下載多個(gè)圖片從而滿足加速圖片顯示的效果，但是切片完全使用代碼拼合，會(huì)造成一定的錯(cuò)位，每一個(gè)切片都是可以包含一個(gè)鏈接的。熱區(qū)主要應(yīng)對(duì)一張圖片中的不同區(qū)域要鏈接到不同地址的效果，熱區(qū)只可以在一張圖片上使用，但熱區(qū)不限制形狀，可以繪制很多的形狀。

使用 CTRL+C 復(fù)制，使用 CTRL+V 粘貼。 

要使用熱區(qū)，首先在要使用熱區(qū)的圖片代碼中加入 usemap 屬性，并且進(jìn)行一個(gè)名稱的設(shè)定，名稱前面必須加上 # 號(hào)。

用 map 標(biāo)簽繪制圖片地圖，name 和 ID 控制圖片對(duì)應(yīng)的地圖，所以 name 和 ID 一定要和 usemap 的名稱相同。

在 map 標(biāo)簽之內(nèi) 使用 area 標(biāo)簽控制熱區(qū)，shape 是熱區(qū)類型，以上面代碼為例，分別為多邊形，圓形，長(zhǎng)方形。coords 控制坐標(biāo)，多邊形和長(zhǎng)方形都是一些樣的，首先是點(diǎn)的 x 坐標(biāo)，然后寫 y 的坐標(biāo)以此類推即可，圓形寫法為 x坐標(biāo)，Y坐標(biāo)，半徑。熱區(qū)結(jié)合使用可以應(yīng)對(duì)各種形狀的圖形。

在淘寶方面，使用熱區(qū)是非常方便的，因?yàn)橹挥靡粡垐D片即可。

生活不易，碼農(nóng)辛苦
如果您覺得本網(wǎng)站對(duì)您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈(zèng)