dw小秘訣

1、一、背景分析對(duì)想要在視覺化環(huán)境下制作復(fù)雜網(wǎng)頁(yè)的專業(yè)網(wǎng)頁(yè)制作者來(lái)說(shuō)，Dreamweaver已經(jīng)漸漸在網(wǎng)頁(yè)編輯工具中展露頭角，成為專業(yè)人士編寫網(wǎng)頁(yè)的最佳選擇。根據(jù)Macromedia公司的調(diào)查，Dreamweaver目前已累積有超過(guò)七十萬(wàn)名的使用者，占有率在網(wǎng)頁(yè)編輯工具中居冠，像“AdobeGoLive”和“ObjectsFusion”等競(jìng)爭(zhēng)者都被遙遙拋在后頭。因此一般地預(yù)估Dreamweaver的使用群體將會(huì)持續(xù)的增加。在這種勢(shì)不可擋的普

2、及率席卷之下，可想而知Dreamweaver內(nèi)置的功能可說(shuō)是越來(lái)越多、越來(lái)越豐富、齊全。在這次我們的介紹中，就有新增一些功能提供網(wǎng)頁(yè)制作者一些更快速的設(shè)計(jì)、更容易地編碼及整合性更強(qiáng)的功能。事不宜遲，以下我們介紹如何善用Dreamweaver里的一些功能。以下密技共有十二項(xiàng)，可分成四個(gè)主題。分別是：設(shè)計(jì)網(wǎng)頁(yè)頁(yè)面(Dreamweaver里具有彈性的頁(yè)面設(shè)計(jì)功能)、搭配Macromedia其它產(chǎn)品一起使用Dreamweaver(制作動(dòng)畫和圖片

3、不求人)、自訂使用界面(享受個(gè)性化的使用經(jīng)驗(yàn))和最后的加入Dreamweaver擴(kuò)充程序(在網(wǎng)頁(yè)中載入擴(kuò)充高級(jí)功能)。二、設(shè)計(jì)網(wǎng)頁(yè)頁(yè)面的秘訣不管你是要運(yùn)用HTML原始語(yǔ)法逐字逐字來(lái)編寫網(wǎng)頁(yè)，或是運(yùn)用標(biāo)準(zhǔn)化窗口來(lái)進(jìn)行網(wǎng)頁(yè)的視覺設(shè)計(jì)，以下的小秘訣都可以派得上用場(chǎng)。秘訣1：讓網(wǎng)頁(yè)頁(yè)面大小更有彈性有些網(wǎng)頁(yè)開發(fā)者稱以下要介紹的這種技巧為“l(fā)iquid”，在這兒則把這種技巧叫做是“彈性延伸的技巧”。這是一種技巧，可在訪客瀏覽器窗口大小改變時(shí)也隨之調(diào)

4、整網(wǎng)頁(yè)頁(yè)面大小，因此如果窗口過(guò)大就不會(huì)有空白處窗口過(guò)小邊緣就不會(huì)跑出上下移動(dòng)的拉條。其實(shí)大多數(shù)簡(jiǎn)單的網(wǎng)頁(yè)會(huì)自己隨著瀏覽器窗口大小來(lái)調(diào)整頁(yè)面大小，但是如果是網(wǎng)頁(yè)里用到很多不同的框架及表格，網(wǎng)頁(yè)頁(yè)面大小就很難自動(dòng)彈性地調(diào)整。通常網(wǎng)頁(yè)設(shè)計(jì)者會(huì)用混合運(yùn)用固定寬度的框架，和GIF圖片作為間隔來(lái)設(shè)計(jì)網(wǎng)頁(yè)頁(yè)面，這樣一來(lái)不論是用InterExpler或是用scapeNavigat，頁(yè)面大小都會(huì)固定而不會(huì)跑掉。用Dreamweaver4.0可以輕而易舉的

5、設(shè)計(jì)出會(huì)自動(dòng)彈性調(diào)整的網(wǎng)頁(yè)。要怎么做呢★具體做法：用工具面板(Objectpalette)上的按鈕打開網(wǎng)頁(yè)，并且轉(zhuǎn)換到“格式查看”(Layoutview)。這時(shí)可以看到文字方塊的欄度，每一欄的方框上方中間還有一個(gè)小小的下拉式箭頭，點(diǎn)選想要設(shè)置彈性顯示的欄上方的小箭頭，接著選擇“將欄設(shè)為彈性顯示”(MakeColumnAutostretch)。(設(shè)置自動(dòng)調(diào)整欄的寬度以一欄為限)這時(shí)該欄方框上方就會(huì)出現(xiàn)一條波浪形的線，而不是原本表示欄度的數(shù)

6、字。Dreamweaver會(huì)自動(dòng)制作出固定版面的空格圖片，這個(gè)空白圖片是以欄上方的兩個(gè)長(zhǎng)條形的空白表格表示，如此版面會(huì)自動(dòng)被填充，才會(huì)完成彈性版面設(shè)置。(在第一次增加空白圖片時(shí)會(huì)跳出一個(gè)對(duì)話框問你是否要使用內(nèi)置圖片，為求效果，我們建議你讓Dreamweaver自動(dòng)產(chǎn)生一個(gè)，不然就不用使用空白圖片來(lái)填充版面。)“Firewks”。(如果仔細(xì)看，你會(huì)發(fā)現(xiàn)Firewks的畫面會(huì)出現(xiàn)“EditingFromDreamweaver”這樣的文字和圖

7、樣，指示你可以在Dreamweaver里進(jìn)行圖片編輯。)好了，現(xiàn)在在“Firewks”里點(diǎn)選要編輯的圖片，選擇“ModifyAnimateAnimateion”。接下來(lái)完成“Animatedialogbox”里的設(shè)置，選定動(dòng)畫的幀數(shù)，動(dòng)畫移動(dòng)的方向、透明度等等設(shè)置。你也可以點(diǎn)選“Frames”工具設(shè)置移動(dòng)速度，選擇“Object”面板來(lái)改變?cè)O(shè)置。要導(dǎo)出文件時(shí)，只要點(diǎn)選“Optimize”工具欄，在文件類型的地方選擇“AnimatedGI

8、F”。完成以后，“Firewks”就會(huì)自動(dòng)將圖片以最佳化設(shè)置導(dǎo)出，并且自動(dòng)將GIF圖片更新，還會(huì)在Dreamweaver里將更新過(guò)的圖片顯示出來(lái)。點(diǎn)選“FilePreviewinBrowser”，這樣就可以在瀏覽器里預(yù)覽剛剛制作完成的可愛圖片。秘訣5：讓按鈕有閃動(dòng)效果在Dreamweaver中，不用有Flashs，也可以制作有閃動(dòng)效果的Flash按鈕物體。Dreamweaver內(nèi)置有好幾個(gè)Flash按鈕物體，可以制作好幾個(gè)不同形式的按鈕

9、?！锞唧w做法：點(diǎn)選“InteractiveImagesFlashButton”就可看到有那些內(nèi)置按鈕。在對(duì)話框內(nèi)甚至可以用鼠標(biāo)指到想要使用的按鈕形式，然后看看在瀏覽器里的效果如何。用鼠標(biāo)指針把要用的按鈕形式選定，再依順序輸入?yún)?shù)，例如按鈕上的文字、字形、顏色、超鏈接等，或是自設(shè)文件名字。按下OK。接下來(lái)就會(huì)有一個(gè)“SWF”格式的文件產(chǎn)生，文件并會(huì)自動(dòng)導(dǎo)入你的網(wǎng)頁(yè)中。按一下這個(gè)做好的文件，會(huì)看到“PropertyInspect”(屬性明細(xì)

10、)中會(huì)顯示出文件的屬性。將文件屬性顯示出來(lái)時(shí)，如果擴(kuò)展文件屬性明細(xì)表，會(huì)出現(xiàn)“Play”(播放)，點(diǎn)選之后可以不用打開瀏覽器來(lái)預(yù)覽按鈕的閃動(dòng)效果。秘訣6：制作流動(dòng)文字在網(wǎng)頁(yè)中增加流動(dòng)文字就像增加我們剛剛介紹的Flash按鈕一樣簡(jiǎn)單。相同地，不用安裝Flash，用Dreamweaver提供的新功能就可以輕松辦到。常用HTML語(yǔ)法寫網(wǎng)頁(yè)、沒有互動(dòng)式媒體經(jīng)驗(yàn)的網(wǎng)頁(yè)制作者也可以輕松制作出小巧的Flash形式的流動(dòng)文字。這項(xiàng)新功能可以在不添加相兼

11、容性麻煩的情況下為網(wǎng)頁(yè)增添一些瀏覽上與訪客的互動(dòng)性?！锞唧w做法：點(diǎn)選“InteractiveImagesFlashText”，再將參數(shù)設(shè)置一一填入(例如要更改效果的文字、字形、字體顏色及字體大小等等)。秘訣7：更改鍵盤快捷鍵Dreamweaver可讓使用者自訂使用界面，這項(xiàng)設(shè)計(jì)十分有彈性。舉例來(lái)說(shuō)，使用者可以通過(guò)編寫程序或自行增加物體(object)的方式來(lái)更改菜單。不必功力高深，你就可以更改鍵盤快捷鍵，因?yàn)镈reamweaver有一項(xiàng)