如何使用fireworks切片
當(dāng)使用Fireworks設(shè)計(jì)了一幅完整的設(shè)計(jì)效果圖之后，如果要將這份完美的網(wǎng)頁(yè)放到網(wǎng)上，瀏覽器下載一幅較大的圖像需要較長(zhǎng)的時(shí)間，會(huì)造成用戶不必要的等待。怎么使用fireworks切片呢?通下面學(xué)習(xí)啦小編給大家整理了關(guān)于使用fireworks切片的方法，希望大家喜歡。
使用fireworks切片的方法步驟：
當(dāng)使用Fireworks設(shè)計(jì)了一幅完整的設(shè)計(jì)效果圖之后，如果要將這份完美的網(wǎng)頁(yè)放到網(wǎng)上，瀏覽器下載一幅較大的圖像需要較長(zhǎng)的時(shí)間，會(huì)造成用戶不必要的等待。通過(guò)將這個(gè)大的圖像切割為多個(gè)容易下載的小塊，可以加速網(wǎng)頁(yè)的響應(yīng)時(shí)間，提升網(wǎng)頁(yè)的響應(yīng)速度。
在Fireworks中，被切片的圖形的每一部分都會(huì)作為一個(gè)單獨(dú)的圖像進(jìn)行保存，切片輸出時(shí)會(huì)保存為一個(gè)HTML文件以引用這些被切割的圖形。舉例來(lái)說(shuō)，在Fireworks的模板的Web項(xiàng)中有一些設(shè)計(jì)好的網(wǎng)頁(yè)原型，這些原型使用Fireworks的矢量繪圖工具進(jìn)行繪制，網(wǎng)頁(yè)設(shè)計(jì)人員在需要保留布局的同時(shí)，又能去除圖像中的文本部分，用HTML文本進(jìn)行替代。例如圖14.54就是一個(gè)完整設(shè)計(jì)的網(wǎng)頁(yè)圖像。
Fireworks兩種切片類(lèi)型：
矩形切片：這是比較常用的切片方式，用于按矩形對(duì)圖像進(jìn)行切分。
多邊形切片：用來(lái)創(chuàng)建不規(guī)則形狀的切片，比如試圖為非矩形的圖形添加圖像交互式效果時(shí)，可以通過(guò)非矩形切片來(lái)創(chuàng)建切片效果。
對(duì)于網(wǎng)頁(yè)圖像的切片來(lái)說(shuō)，一般還是以矩形切片為主，要?jiǎng)?chuàng)建矩形切片，單擊繪圖工具欄中的工具，選擇該工具后，在需要進(jìn)行切片的地方繪制矩形，就可以創(chuàng)建一個(gè)切片對(duì)象。
注意：從切片對(duì)象延伸的線是切片輔助線，它確定導(dǎo)出時(shí)將文檔拆分成的單獨(dú)圖像文件的邊界。默認(rèn)情況下，這些輔助線為紅色。
切片的輔助線用于定位和對(duì)齊切片，這個(gè)功能非常實(shí)用，否則切片就會(huì)顯示得比較混亂。當(dāng)拖動(dòng)以繪制切片時(shí)，可以調(diào)整切片的位置。在按住鼠標(biāo)按鈕的同時(shí)，只需按住空格鍵，然后將切片拖動(dòng)到畫(huà)布上的另一個(gè)位置。釋放空格鍵以繼續(xù)繪制切片，切片效果如圖14.55所示。
除了直接繪制切片外，還可以選擇某一個(gè)圖像區(qū)域，比如選擇文字內(nèi)容，然后單擊主菜單中的“編輯|插入|矩形切片”菜單項(xiàng)，來(lái)根據(jù)選擇的區(qū)域創(chuàng)建一個(gè)矩形切片，這樣就可以根據(jù)內(nèi)容的大小來(lái)精確地創(chuàng)建切片區(qū)域。例如圖14.56中根據(jù)選擇工具創(chuàng)建了多個(gè)選擇內(nèi)容的切片。
如果選擇了多個(gè)繪圖區(qū)域，單擊菜單中的插入矩形切片，F(xiàn)ireworks會(huì)彈出如圖14.57所示的對(duì)話框，詢問(wèn)用戶是創(chuàng)建單一的切片還是多重切片。
單一切片是指將所選的區(qū)域合并為單一的矩形，而多重切片將為每一個(gè)選區(qū)創(chuàng)建一個(gè)切片。在設(shè)置了切片之后，使用選擇工具選擇切片，在屬性面板中可以設(shè)置切片的類(lèi)型和鏈接，如圖14.58所示。
默認(rèn)情況下，切片顯示為淡綠色，通過(guò)切片的屬性面板，可以更改切片的顏色。切片的默認(rèn)類(lèi)型為前景圖像，這是指切片在輸出HTML時(shí)，HTML代碼的編寫(xiě)方式?？梢詫⑵湔{(diào)整為HTML背景，比如對(duì)于顏色比較接近的圖像，就可以調(diào)整為切片的背景圖像。HTML類(lèi)型的切片指定瀏覽器中出現(xiàn)普通HTML文本的區(qū)域。HTML切片不導(dǎo)出圖像，它導(dǎo)出出現(xiàn)在由切片定義的表格單元格中的HTML文本。
多邊形切片用來(lái)創(chuàng)建具有多邊形效果的切片圖像，它實(shí)際上是通過(guò)JavaScript代碼來(lái)實(shí)現(xiàn)的多邊形效果。選擇多邊形切片工具，在要?jiǎng)?chuàng)建多邊形熱點(diǎn)的圖像上進(jìn)行單擊以創(chuàng)建多邊形的點(diǎn)，多邊形切片的創(chuàng)建效果如圖14.59所示。
切片創(chuàng)建完成后，要查看和編輯網(wǎng)頁(yè)上的切片，可以通過(guò)圖層面板中的網(wǎng)頁(yè)層實(shí)現(xiàn)。層面板上可以顯示和隱藏切片，更改切片和切片輔助線，圖層面板的顯示如圖14.60所示。
看過(guò)“如何使用fireworks切片“的人還看了：