fireworks網(wǎng)頁設(shè)計(jì)綜合實(shí)例(參考版)
2025-07-02 18:04本頁面
【正文】 。最后將這些單獨(dú)輸出的部分在Dreamweaver中利用表格組裝起來，這樣可以最大限度的保持頁面的適應(yīng)性和靈活性。但是具體到實(shí)際應(yīng)用，我們應(yīng)該根據(jù)具體的內(nèi)容設(shè)計(jì)您的版面，而且盡可能的多利用Fireworks的局部輸出功能，將一個(gè)頁面分成多個(gè)部分輸出，這樣可以使頁面具有更大的靈活性和可操作性。 寫在后面的話 到這里，我們的這個(gè)網(wǎng)頁設(shè)計(jì)實(shí)例教程介紹完了。如下圖所示： 我們現(xiàn)在在Fireworks中作一點(diǎn)小修改，在卡爾松服飾有限公司下方增加文字?！ ?此時(shí)會(huì)啟動(dòng)Fireworks4。此時(shí)文本的樣式如下圖所示： 選擇整個(gè)表格使用文檔窗口底部的快速標(biāo)簽選擇器選擇table標(biāo)簽。 點(diǎn)擊確定將文件輸出。 在Empty Cell區(qū)域，在彈出菜單中選擇Spacer Image。 在Option選項(xiàng)中可以進(jìn)行更詳細(xì)的設(shè)置，選擇General標(biāo)簽，確定在HTML style選項(xiàng)中Dreamweaver被選擇。選擇輸出格式為GIF格式，色彩數(shù)為128色。如下圖所示： 十四、 輸出HTML文件到Dreamweaver 我們的設(shè)計(jì)文檔已經(jīng)完成，可以將其輸出為HTML文件，并轉(zhuǎn)到Dreamweaver中繼續(xù)進(jìn)行編輯。需要注意的是，您在這里不僅可以輸入普通的文字內(nèi)容，還可以輸入標(biāo)準(zhǔn)的HTML格式內(nèi)容，如我們輸入的center和font color=white。 我們還可以對(duì)文檔正中的切片設(shè)定為文字切片，及將來輸出時(shí)此部分輸出為文字內(nèi)容。 選中左邊人像部分的切片，打開優(yōu)化面板，設(shè)定輸出格式為JPEG，質(zhì)量為60?！ ?打開優(yōu)化面板Optimize設(shè)定此切片的類型為Animated GIF，顏色數(shù)為32，如下圖所示： 十三、 優(yōu)化圖像 我們的設(shè)計(jì)稿基本完成，下面我們需要針對(duì)不同對(duì)象設(shè)定各自的優(yōu)化參數(shù)和輸出格式。 在層面板中切換到Logo層，在剛才的左上角位置處輸入文字Karsong。十二、 創(chuàng)建實(shí)時(shí)動(dòng)畫Live Aniamation Fireworks4新增了一種實(shí)時(shí)動(dòng)畫創(chuàng)作方式，這種方式可以快速的創(chuàng)建一個(gè)動(dòng)畫符號(hào)，生成的動(dòng)畫具有即時(shí)編輯性能，及您可以在任意時(shí)間修改形成動(dòng)畫的各種元素屬性。 在Effect面板修改第二個(gè)實(shí)例的特效，將其改為黃色，并改變Glow的范圍和大小，如下圖： 選擇這兩個(gè)實(shí)例，在右鍵彈出菜單中執(zhí)行SymbolsTween Instances創(chuàng)建變形動(dòng)畫，設(shè)定插入幀數(shù)為6幀，并勾選Distribute to Frames分布到幀，如下圖所示： 打開Web Layer圖層的顯示，在此動(dòng)畫位置創(chuàng)建一個(gè)切片。 按F8將其轉(zhuǎn)換為圖形符號(hào)Graphic Symbol。 在層面板新建一個(gè)Logo層，將其置于Web Layer層下方?！ ∈弧?創(chuàng)建變形動(dòng)畫 給一個(gè)網(wǎng)站添加動(dòng)畫對(duì)于訪問者的時(shí)間和金錢都是一個(gè)不小的花銷，因此在添加您的動(dòng)畫前，一定要先考慮好如下問題：動(dòng)畫能否增進(jìn)您的信息傳達(dá)力度，訪問者下載和播放動(dòng)畫是否迅速、方便，是否有足夠的組成動(dòng)畫的內(nèi)容和資源。 我們?cè)俅尉庉媱偛艅?chuàng)建的彈出菜單，就可以選擇我們自定義的樣式了。如下圖： 打開Style面板，選中剛才創(chuàng)建的矩形，在Style面板的彈出菜單中選擇New Style創(chuàng)建一個(gè)新的樣式，并命名為MyStyle，如下圖： 此時(shí)您的Style面板中已經(jīng)添加了一個(gè)新的樣式。我們可以根據(jù)不同設(shè)計(jì)項(xiàng)目的需要將自定義的樣式作為彈出菜單的選項(xiàng)。我們選擇圖片格式，并設(shè)定文字大小為10。 點(diǎn)擊此按鈕上切片中心的圓形標(biāo)志，從彈出菜單中選擇Add Popup Menu增加彈出菜單，如下圖所示： 在彈出的編輯器中輸入如下圖所示內(nèi)容，在Text和Link輸入框中輸入內(nèi)容后，點(diǎn)及上部的+即可添加新的菜單內(nèi)容： 繼續(xù)輸入二級(jí)菜單內(nèi)容，選中一個(gè)條目后，點(diǎn)擊上部的 可以使當(dāng)前條目縮進(jìn)，成為下一級(jí)菜單；點(diǎn)擊 可以使當(dāng)前的條目恢復(fù)為上一級(jí)菜單。Fireworks4新增的創(chuàng)建彈出菜單功能，可以非常容易的實(shí)現(xiàn)這種導(dǎo)航結(jié)構(gòu)，我們只需將分層信息添加到彈出菜單編輯器中，程序會(huì)自動(dòng)生成相應(yīng)的交互式代碼。 最后的效果如下圖所示： 十
法律信息相關(guān)推薦
鄂ICP備17016276號(hào)-1