用Dreamweaver MX建設神奇網頁圖片超連結

來源:互聯網
上載者:User
dreamweaver|連結|網頁 大家在開啟帶有圖片的網頁時,有時會看到這樣的情況:當滑鼠指向圖片的不同部位時,可以開啟不同的超連結,這種技術我們稱之為—網頁圖片熱區。

  下面我們以Dreamweaver MX和FrontPage 2003為例,來看看網頁圖片熱區的具體建立過程。

  一、在Dreamweaver MX中為圖片建立熱區

  1、啟動Dreamweaver MX(其他版本請仿照操作),開啟需要建立圖片熱區的網頁檔案,選中相應的圖片,此時“屬性”面板自動切換到“圖片屬性”狀態(如圖1)。

  2、選中一種熱區類型(如“橢圓”),然後在圖片上拖來出一個熱區來(參見圖1)


圖1

  注意:熱區相當於是在圖片上增加了一個圖形層,象調整圖片一樣,可以通過滑鼠調整熱區的大小和位置。

  3、在“連結”右邊的方框中輸入要連結的網址(如“http://www.yesky.com”);在“替代”後面的方框中輸入一些說明字元(如“天極網”);按“目標”右邊的下拉按鈕,在隨後出現的下拉式清單中選擇一種連結頁面的開啟檔案(如需要讓連結的頁面在新視窗中開啟,就選擇“_blank”選項)。

  注意:“替代”方框中輸入的字元,在以後瀏覽網頁時,當滑鼠指向該熱區時,在頁面上會顯示出該字元(如圖2)。


圖2

 4、重複上述2、3步的操作,在圖片的不同部位建立多個熱區。

  二、在FrontPage2003中為圖片建立熱區

  1、啟動FrontPage2003,開啟需要建立圖片熱區的網頁檔案。

  2、執行“視圖→工具列→圖片”命令,展開“圖片”工具列(如圖3)


圖3

  3、選中一種熱區類型(如“長方形”),然後在圖片上拖來出一個熱區,此時系統自動彈出“插入超連結”對話方塊(如圖4)。


圖4

  4、在“地址”欄上輸入要連結的網址(如“www.yesky.com”);點擊“工具提示”按鈕開啟“設定螢幕超連結提示”對話方塊(如圖5),輸入一些說明字元(如“天極網”)。


圖5

  注意:此處的“工具提示”同Dreamweaver MX“替代”功能一樣。

  4、同理,重複上述3、4步的操作,可以在圖片的不同部位建立多個熱區。



相關文章

Alibaba Cloud 10 Year Anniversary

With You, We are Shaping a Digital World, 2009-2019

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。