fireworks界面切圖操作指導(dǎo)書

1、界面切圖軟件介紹與其他的常用應(yīng)用軟件類似，有標(biāo)題欄、菜單欄和快捷欄，標(biāo)題欄用于顯示目前正在處理的文件，菜單欄顯示當(dāng)前軟件的可操作功能，快捷欄將常用的設(shè)置功能以功能圖標(biāo)的方式顯示，除此之外，還有每個(gè)軟件獨(dú)特的面板組。（1）Photoshop圖像圖層處理軟件這是選擇psd文件之后，Photoshop的顯示效果，其中圖片區(qū)域左側(cè)為工具箱，顯示各種常見的圖片圖層處理工具，右側(cè)最下方為圖層面板組（如圖2 所示），顯示當(dāng)前所有圖層，以及每個(gè)圖層上增加的特殊效果。工具箱中我們?cè)诖舜螒?yīng)用中常用的是最上方的（移動(dòng)工具），點(diǎn)擊此工具可以在圖片中點(diǎn)擊欲處理圖層任意位置，右擊后將彈出的快捷菜單，列出與當(dāng)前點(diǎn)相關(guān)圖層，

2、從中選擇當(dāng)前位置的圖層，如果已知圖層名稱也可直接在圖層面板組中單擊選擇，選中之后，圖層名稱項(xiàng)將以藍(lán)色背景顯示，表示當(dāng)前處于可處理狀態(tài)。圖2 圖層面板組選中圖層后，即可對(duì)該圖層進(jìn)行操作，如可在任意位置拖動(dòng)鼠標(biāo)，圖像中圖層將根據(jù)鼠標(biāo)拖動(dòng)方向進(jìn)行移動(dòng)；或直接按Del鍵刪除；或按圖層面板組下方的按鈕，從中選擇某項(xiàng)功能，對(duì)當(dāng)前圖層進(jìn)行樣式設(shè)置，即改變圖層顯示效果，尤其是“顏色疊加”，可以改變當(dāng)前的圖層的顯示顏色；如果打開了兩個(gè)圖片，甚至可以將其中一個(gè)圖片的圖層拖動(dòng)至另一個(gè)圖片增加圖層。而圖片是可以點(diǎn)擊的，有此圖片，表示此圖層或此效果將在圖片中顯示，單擊后消失，表示此圖層或此效果將取消。除了快捷方式Ctr

3、l+“+”和Ctrl+“-”可縮放圖片之外，還可以利用右側(cè)面板組上方的導(dǎo)航器面板組（如圖3所示），下方的顯示控制，或直接輸入百分比，或右側(cè)滑塊進(jìn)行調(diào)整。放大顯示后，如果當(dāng)前軟件界面中圖片可視區(qū)域不能盛放當(dāng)前圖片，除了可以通過默認(rèn)出現(xiàn)在圖片旁邊的滾動(dòng)條進(jìn)行圖片編輯區(qū)域定位外，也可利用默認(rèn)出現(xiàn)在導(dǎo)航器面板中圖片縮略圖的紅色框（表示當(dāng)前可視區(qū)域）進(jìn)行拖動(dòng)找到指定位置。圖3 導(dǎo)航器面板組除此之外，在此應(yīng)用中，菜單中常用的功能，除了【文件】菜單的存儲(chǔ)命令外，另外一個(gè)常用菜單就是【圖像】|【調(diào)整】|【色相/飽和度】命令（快捷方式Ctrl+“u”），選中某個(gè)圖層后，可以利用該命令轉(zhuǎn)變圖層中當(dāng)前顯示顏色，與樣

4、式設(shè)置中的顏色疊加不同，顏色疊加是相當(dāng)于在圖層上方蒙了一層同種顏色的布，而該命令是按照某種規(guī)律直接改變當(dāng)前圖層中的每種顏色，并且不同顏色的改變結(jié)果不同。其中色相是指色彩顏色，比如紅、藍(lán)等。飽和度是指該顏色的深淺度，亮度指的顏色的光感，最低為全黑，最高為全白。（2）Fireworks圖片切割網(wǎng)頁生成軟件利用fireworks可以實(shí)現(xiàn)頁面的切割，一般處理的圖片為png格式，并且在處理過程中也有層的概念。左側(cè)也是相應(yīng)圖片處理工具箱，并根據(jù)工具類型進(jìn)行命名和分類，在網(wǎng)頁圖片處理的過程中常用的是【選擇】工具（如圖5所示）和【W(wǎng)eb】工具（如圖6所示）。其中【W(wǎng)eb】工具中的切割工具用拖選方式來切割圖片，

5、而下方的切割框架顯示工具用于顯示或隱藏切割示意框，【選擇】工具中的（指針工具）用于選中層及拖動(dòng)操作（可在右側(cè)的默認(rèn)打開的“層”面板組中進(jìn)行選擇），（部分選中工具）用于調(diào)整切割邊界，用于通過拖選方式將畫面直接裁切至拖選框大小。圖5 圖6此外，最常用的命令是菜單欄中【文件】菜單的【另存為】和【導(dǎo)出】命令，另存為主要用于將圖片存為jpg格式或png格式，導(dǎo)出主要用于將圖片根據(jù)切割效果導(dǎo)出為網(wǎng)頁文件（注意切割出來的圖片最好用images文件夾保存，即導(dǎo)出對(duì)話框中選擇下方的將“圖象放入子文件夾”選項(xiàng)）。保存為png格式可以將當(dāng)前的切割效果保存，下次打開時(shí)能夠看到上次切割方式。同時(shí)可以利用拖動(dòng)方式將其他圖

6、片拖動(dòng)至當(dāng)前處理切割圖像，利用指針工具拖動(dòng)，或下方的屬性面板，將其與原切割圖像對(duì)齊。這樣如果兩幅圖像大小一致的話，導(dǎo)出時(shí)將按照原圖像的切割效果切割。（3）Dreamweaver網(wǎng)頁處理軟件當(dāng)前應(yīng)用，在打開生成的HTML文件之后，主要用到的是下方的屬性面板，進(jìn)行初步的屬性設(shè)置，以及右側(cè)CSS面板組，進(jìn)行樣式調(diào)整設(shè)置。此外就是菜單欄的【修改】菜單中的【頁面設(shè)置】命令，調(diào)整頁邊距、背景色等，以及【插入記錄】菜單中的各種插入元素命令，尤其是【媒體】和【圖像對(duì)象】命令。在打開HTML文件之后，頁面實(shí)際為多個(gè)圖片的拼接，拼接方式由Fireworks的切割效果決定，選中當(dāng)個(gè)圖片后，即可在下方的屬性面板對(duì)當(dāng)前

7、圖片進(jìn)行屬性設(shè)置，其中“源文件”文本輸入框中顯示當(dāng)前圖像的文件位置，刪除文本輸入框中的文字，則顯示圖像占位符，即表示當(dāng)前仍是圖像，只是具體圖像未知。如果要想去掉當(dāng)前的圖像及圖像占位（因?yàn)閳D像本身不能在其上輸入文字，所以如果打算再圖像上輸入文字，則需要?jiǎng)h除圖像后，此時(shí)下方的屬性面板將更換為與文字設(shè)置相關(guān)的屬性面板，此時(shí)可以直接輸入欲顯示文字，并將其“背景”文本輸入框輸入剛才圖像文件的存儲(chǔ)地址，將圖片以背景顯示）直接按Del鍵刪除即可。說明：背景圖像和圖像的不同，首先背景圖像不能調(diào)整圖像大小，根據(jù)當(dāng)前區(qū)域進(jìn)行自動(dòng)填充，如果小則局部顯示，如果大則平鋪顯示；圖像則可以調(diào)整大小，根據(jù)設(shè)置“寬”和“高”文本輸入框的值進(jìn)行顯示，如果當(dāng)前區(qū)域小于設(shè)置大小，區(qū)域?qū)⑦m應(yīng)圖像大小進(jìn)行擴(kuò)充。其次就是剛才所說的背景圖像可以在其上添加文字，而圖像本身不可。輸入文字后，即可利用屬性面板進(jìn)行字體、字號(hào)和顏色的設(shè)置，設(shè)置完成后將在“樣式”下拉列表框中，將設(shè)置效果進(jìn)行自動(dòng)命名后，將名稱顯示其中，并可以直接看到效果，這樣如果再有同樣設(shè)置的文字，可以將文字選中后，直接利用該名