下面我介紹下我們所用的軟件
好,我們來看看如何運動這兩款軟件
首先是打開你要獲取代碼的圖片,選擇切片工具,是要把圖片切分開來,這樣可以把想填加鏈接的圖片做到,每個切片大小可以不一樣
第二步,在圖片的左上方開始,點擊左鍵拖拉,會出現(xiàn)一個虛線框
然后放開左鍵后,軟件會自動設置,左上角的數(shù)字代表這個切片的序號
然后繼續(xù)切片,第二切片要于第一個切片貼邊,要不然會樣切片1變小或切片不完整
PS:你切分多少等下會得到相對應的圖片,所以你要把你想添加鏈接的那部分要分開來
然后切分后,我們就保存為web和設置所用格式,馬上就結束PS的工作
點擊保存
記住要保存為圖象和html類型
好的,保存之后,PS可以關閉了。下面我們運用Dreamweaver
剛得到兩個文件,把images上傳到圖片空間,html的文件就用Dreamweaver來制作
注意,剛剛因為我們切片的時候是分了4份,所以得到的圖片也就是4個
好的,我們打開Dreamweaver,
Dreamweaver是網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器,它是第一套針對專業(yè)網(wǎng)頁設計師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具,利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網(wǎng)頁。
我用的版本是MX 2004,比較舊了,呵呵.好的我們會看到這樣的一個模版
我先在簡單介紹一下Dreamweaver....Dreamweaver一般打開頁面后的界面包括:菜單欄、面板組、工具欄、代碼編輯區(qū)、屬性和面板組。
我們要運用好這軟件,就必須了解一些基本。連基本都不會,是很難操作起來的,首先是菜單欄一共分文件,編輯,查看,插入,修改,文本,命令,站點,窗口和幫助。我們也不需要對每個都深入研究。
文件菜單:就是包括對文件的各種操作,例如新建,保存等。
編輯菜單:對文件的一些指令,例如是拷貝,粘貼和替換等。
查看彩單:使用查看菜單可以查看文檔的相關內(nèi)容。
接下來就認識一下快捷鍵
Ctrl-B或Ctrl-I來為文字應用黑體或斜體格式,
選中的文本應用HTML格式:
Ctrl-0: 無格式
Ctrl-T: 段落
Ctrl-1: 標題 1
Ctrl-2: 標題 2
然后我們認識一下屬性板,因為等下需要用到,屬性版上可以對選種的對象來進行修改,比如說地址,鏈接,格式,字體等。還有一點,屬性板是根據(jù)當前對象來設置的,你選擇的對象不同,它的顯示出來的屬性調(diào)整就會不同
好的,現(xiàn)在我們看到這樣的畫面,上方是我們等下需要的代碼,中間就是我們的圖片,下面是屬性設置
然后我們按照切片的位置來修改,把圖片的地址改成上傳之后的圖片地址,鏈接是超鏈接的地址,填加對應的地址點擊圖片會打開,當然沒有需要的部分也不用填加
圖片地址改了后。會變成這樣,是正常的,然后我們繼續(xù)去改換其他
圖片地址改完后,鏈接也填加了,下面馬上完工,拷貝代碼
到我是賣家版面,選擇裝修店鋪
到自定義版塊,點擊編輯HTML,
把剛拷貝的代碼復制下去,然后保存
這樣,我們的圖片就完成了,若有填加鏈接的圖片,點擊是可以打開的