Dreamweaver中如何設定熱區?

Tags: 圖片, 熱區,

Dreamweaver中如何設定熱區

方法/步驟

向平時一樣,這裡我們在設定Dreamweaver熱區的時候。同樣這裡是需要建立一個新的HTML介面的。

Dreamweaver中如何設定熱區

建立完畢,如下圖中所示的一個新的文件(HTML)

Dreamweaver中如何設定熱區

按照同時最為簡潔的方式,我們在新的HTML中插入一個新的圖片作為熱區設定的底片

Dreamweaver中如何設定熱區

選擇桌面中的一個圖片進行新增

Dreamweaver中如何設定熱區

在建立相對的路徑時我們是需要儲存文件的

Dreamweaver中如何設定熱區

這裡大家注意的是我們的根檔案是必須要儲存在一個站點中的。這裡我們將其路徑複製儲存在我們的站點中

Dreamweaver中如何設定熱區

選擇站點目錄進行儲存即可

Dreamweaver中如何設定熱區

影象標籤輔助功能屬性這裡我們是不需要進行設定的,點選確定即可

Dreamweaver中如何設定熱區

隨後就是如下圖中的一個圖片插入的介面了。

Dreamweaver中如何設定熱區

點選選中圖片之後我們選擇底部熱鍵工具

Dreamweaver中如何設定熱區

選擇我們的一個熱鍵的區域,這裡我們選擇的是圖片中人物的右眼。“以正方形的形式”

Dreamweaver中如何設定熱區

隨後我們將其眼部的熱鍵區域的連結設定成為百度的一個接入口

Dreamweaver中如何設定熱區

將滑鼠移至空白處然後點選儲存

Dreamweaver中如何設定熱區

儲存完畢之後,按鍵盤中的F12進入瀏覽區的介面中,這裡我們選擇圖片中人物之後進行點選

Dreamweaver中如何設定熱區

隨後就可以跳轉到你設定的一個百度的介面中,(注意這裡我們只有點選了熱建中的區域後才能進行跳轉)

Dreamweaver中如何設定熱區

同樣的方式,這裡我們用圓形設定圖片人物的一個左眼

Dreamweaver中如何設定熱區

按照同樣的方式,這裡我們對圖片區域的熱鍵進行設定

Dreamweaver中如何設定熱區

選擇另外的一個圖片進行跳轉

Dreamweaver中如何設定熱區

同樣的是這樣我們是需要設定儲存期路徑的

Dreamweaver中如何設定熱區

點選確定儲存

Dreamweaver中如何設定熱區

設定儲存完畢之後按F12進入除錯,這次我們點選器左眼

Dreamweaver中如何設定熱區

隨後我們就可以跳轉到你所設定的那個介面了。

Dreamweaver中如何設定熱區

相關問題答案