- 相關(guān)推薦
如何用Fireworks cs5制作下拉導航條
很多網(wǎng)頁(yè)設計人員經(jīng)常會(huì )用到下拉導航，網(wǎng)上有很多現成的例子，下載即可使用。但是如果想和自己制作的網(wǎng)頁(yè)比較兼容，就需要不停的進(jìn)行修改設置，比較麻煩，那么有沒(méi)有比較方便的方法來(lái)實(shí)現下拉導航的制作呢?今天我就來(lái)分享一下采用FIREWORKS CS5制作下拉導航(菜單)的方法
工具/原料
FIREWOKRS CS5
電腦一臺
方法/步驟
1下載安裝FIREWOKRS CS5(我目前電腦上已經(jīng)安裝)并啟動(dòng)軟件，建議大家購買(mǎi)正版軟件，此處不做過(guò)多說(shuō)明。
2新建一個(gè)寬950像素X35像素，分辨率為72像素的畫(huà)布，并且點(diǎn)確定，如下圖二
3選擇矩形工具，在畫(huà)布上拖動(dòng)出一個(gè)大小為950X35像素黑白漸變的圖形
4漸變的顏色大家可以根據自己網(wǎng)頁(yè)的風(fēng)格進(jìn)行調整)，單擊屬性面板中的油漆桶工具，調整顏色為紅色漸變，調整完畢，畫(huà)布上的矩形圖形的顏色已經(jīng)發(fā)生了變化。
5選擇矢量工具內的文本工具，鍵入導航上需要顯示的文字，為了演示方便，我只打了幾個(gè)導航的文字。
6下邊我們開(kāi)始正式制作下拉導航，也就是平時(shí)常說(shuō)的下拉菜單。選擇切片工具，一次切好對應的大小
7點(diǎn)擊產(chǎn)品展示這個(gè)切片中心位置的圓形圖形，彈出下拉菜單選擇“添加彈出菜單”選項，
8選擇后臺在彈出的面板分別添加產(chǎn)品分類(lèi)1，產(chǎn)品分類(lèi)2，產(chǎn)品分類(lèi)3等下拉菜單的文字內容。鏈接和打開(kāi)窗口大家可以根據自己的需要手動(dòng)添加即可。
9下拉導航添加完成后，在彈出菜單編輯器面板點(diǎn)擊繼續，分別進(jìn)行外觀(guān)、高級、及位置設置，最后點(diǎn)擊完成。如下圖2所示
10下拉導航的顯示位置需要手動(dòng)拖動(dòng)進(jìn)行簡(jiǎn)單的調整，如下圖，用鼠標左鍵選中紅色方框框選的內容，進(jìn)行左右或者上下拖動(dòng)，將下拉內容顯示的合適的位置進(jìn)行顯示，此處需要進(jìn)行多次調整并通過(guò)導出的頁(yè)面文件進(jìn)行測試，直到顯示完美即可。
11回到FW主界面，在畫(huà)布外的任意位置，點(diǎn)擊鼠標右鍵，彈出菜單選擇“全選”，全選的目的是為了保證每個(gè)切邊的狀態(tài)為選中。
12這里有三種全選的方法，大家可以采取任意一種：
方法1：直接在FW主界面，按下快捷鍵“CTRL+A”進(jìn)行快速全選(圖示略);
方法2：即上面提到的方法(圖示略);
方法3：在畫(huà)布外的任意位置，按下鼠標左鍵不放，拖動(dòng)選擇，將畫(huà)布上的內容可以全部選中，如下圖所示：
13導出選項如下圖1，導出后的文件如下圖2
14雙擊導出的未命名1.htm這個(gè)文件進(jìn)行瀏覽，最終效果如下。
注意事項
用FW制作導航時(shí)，需要注意導航的風(fēng)格要與網(wǎng)頁(yè)的風(fēng)格統一
制作好的導航需要應用時(shí)，記得將導出的文件需要全部完整拷貝到網(wǎng)頁(yè)文件夾對應的目錄
【如何用Fireworks cs5制作下拉導航條】相關(guān)文章：
如何用wps表格制作表格02-17
如何用CorelDraw制作一個(gè)精美的書(shū)簽08-04
攝影師必看：如何用PS拼合制作全景照片07-09
如何用麥當勞給的郵箱？07-10
小米MIUI V5下拉菜單的開(kāi)關(guān)設置07-10
如何用openssl查找素數?07-10
如何用京東白條購物07-11
QQ空間簽到有何用？07-10