剖析：Dreamweaver網頁制造訣竅之一

中心提示：介紹如何善用Dreamweaver里的一些功用，分別是：規劃網頁頁面（Dreamweaver里具有彈性的頁面規劃功用）、搭配Macromedia其它產品一同運用Dreamweaver（制造動畫和圖片不求人）、自訂運用界面（享用個性化的運用經驗）和最終的參加Dreamweaver擴大程序（在網頁中載入擴大

　　一、布景剖析

　　對想要在視覺化環境下制造復雜網頁的專業網頁制造者來說，Dreamweaver現已逐漸在網頁修正東西中展露頭角，成為專業人士編寫網頁的最佳挑選。

　　根據Macromedia公司的調查，Dreamweaver現在已累積有超過七十萬名的運用者，占有率在網頁修正東西中居冠，像“Adobe GoLive”和“NetObjects Fusion”等競爭者都被遙遙拋在后頭。因而一般地預估Dreamweaver的運用群體將會持續的添加。

　　在這種勢不可擋的普及率席卷之下，可想而知Dreamweaver內置的功用可說是越來越多、越來越豐富、齊全。在這次咱們的介紹中，就有新增一些功用供給網頁制造者一些更快速的規劃、更容易地編碼及整合性更強的功用。

　　刻不容緩，以下咱們介紹如何善用Dreamweaver里的一些功用。以下密技共有十二項，可分紅四個主題。分別是：規劃網頁頁面（Dreamweaver里具有彈性的頁面規劃功用）、搭配Macromedia其它產品一同運用Dreamweaver（制造動畫和圖片不求人）、自訂運用界面（享用個性化的運用經驗）和最終的參加Dreamweaver擴大程序（在網頁中載入擴大高級功用 ）。

　　二、規劃網頁頁面的訣竅

　　不管你是要運用HTML原始語法逐字逐字來編寫網頁，或是運用規范化窗口來進行網頁的視覺規劃，以下的小訣竅都能夠派得上用場。

　　訣竅1：讓網頁頁面巨細更有彈性

　　有些網頁開發者稱以下要介紹的這種技巧為“liquid”，在這兒則把這種技巧叫做是“彈性延伸的技巧”。這是一種技巧，可在訪客瀏覽器窗口巨細改動時也隨之調整網頁頁面巨細，因而假如窗口過大就不會有空白處；窗口過小邊緣就不會跑出上下移動的拉條。

　　其實大多數簡略的網頁會自己隨著瀏覽器窗口巨細來調整頁面巨細，可是假如是網頁里用到許多不同的框架及表格，網頁頁面巨細就很難主動彈性地調整。通常網頁規劃者會用混合運用固定寬度的框架，和GIF圖片作為間隔來規劃網頁頁面，這樣一來不論是用Internet Explorer或是用Netscape Navigator，頁面巨細都會固定而不會跑掉。用Dreamweaver 4.0能夠輕而易舉的規劃出會主動彈性調整的網頁。要怎么做呢？

　　具體做法：用東西面板（Object palette）上的按鈕翻開網頁，而且轉換到“格局檢查”（Layout vIEw）。這時能夠看到文字方塊的欄度，每一欄的方框上方中間還有一個小小的下拉式箭頭，點選想要設置彈性顯現的欄上方的小箭頭，接著挑選“將欄設為彈性顯現”（Make Column Autostretch）。（設置主動調整欄的寬度以一欄為限）這時該欄方框上方就會呈現一條波浪形的線，而不是本來表示欄度的數字。

　　Dreamweaver會主動制造出固定版面的空格圖片，這個空白圖片是以欄上方的兩個長條形的空白表格表示，如此版面會主動被填充，才會完結彈性版面設置。（在第一次添加空白圖片時會跳出一個對話框問你是否要運用內置圖片，為求作用，咱們主張你讓Dreamweaver主動產生一個，不然就不必運用空白圖片來填充版面。）

　　訣竅2：發明個人調色板

　　Dreamweaver新的“Assets panel”（特點控制面板）是一種能夠在修正網站時根據文件格局，例如圖片、款式等來辦理文件的新東西。

　　具體做法：當你界說新站點時（點選Site New Site），一切類型的物體會主動添加到“Asset panel” 里的恰當表框中。這個新參加的“Assets panel”特點控制面板里也有色彩框，貯存你網站里所用到的一切色彩，包括文字的色彩、布景的色彩，以及超鏈接的色彩等。

　　這是一個為運用者量身定做的網站導航色彩盤。只需啟動“Assets panel”（先選 “Window”再點“Assets”），接著點左方那個小小的色彩卷軸，就能夠看到你網站里各式各樣的色彩選項。當然你能夠將這些色彩拉到某些特定選取的文字中。乃至當你挑選某種色彩時，畫面上會呈現這種色彩的十六進位值的色彩淡濃度，和三原色對照碼（RGB）。

　　假如想將調色板東西欄縮小一點，乃至能夠僅參加某些色彩到調色板的“我的最愛”里。只需將選取的色彩反白、點選窗口里一個叫做“新增到我的最愛的”按鈕（最下方靠右的按鈕），就能夠完結了。
　　
　　訣竅3：制造彈出式菜單導航系統
　　
　　本來要制造彈出式菜單導航系統（Pop-up Menu Navigation System）要用到許多的一些JavaScript的語法和技巧，可是假如你有Dreamweaver、Fireworks Studio，即可輕輕松松快速辦到。

　　具體做法：首先在“Fireworks”里開端，挑選某個圖片，然后在“Set Pop-Up Menu”的對話框里點選“ Insert　 Pop-Up Menu”，你能夠輸入項目（items）的稱號并點“PLUS”（參加）按鈕，來新增該項目。你能夠持續在跳出來的信息框里進行細項設置，例如設置該項目所要用的文字及超鏈接，當然也能夠新增子菜單，并重新安排下一層的設置。

　　完結時，點選“Next”（下一步），持續設置各種參數值，例如色彩、字體等等。這時菜單完結后，既能夠預覽HTML語法，也可預覽圖象。再點“ Finish”（完結）。這時當鼠標移動到原來的圖片時，會呈現菜單系統的內容一覽。接著將制造好的文件導出時，“Fireworks”會主動生產出一切 Dreamweaver 需要用到的HTML、JavaScript，以及圖象文件。

　　訣竅4：讓圖片動起來

　　假如你一起裝置有Dreamweaver、Fireworks Studio，這兩種軟件搭配的完美程度將使你贊不絕口。即便你不是專業的圖片規劃者，在規劃網頁時也多多少少想把一些GIF圖片修正得栩栩如生。Dreamweaver能夠讓你制造動畫不求人。

　　具體做法：在規范窗口里挑選要進行修正的圖片，然后在“Property Inspector”里點選“修正”（Edit）。假如你裝置的Dreamweaver里附有“Fireworks”，“Fireworks”就是Dreamweaver預設圖片修正器，這時圖片就會主動載入到“Fireworks”。（假如仔細看，你會發現Fireworks的畫面會呈現“Editing From Dreamweaver”這樣的文字和圖樣，指示你能夠在Dreamweaver里進行圖片修正。）

　　好了，現在在“Fireworks”里點選要修正的圖片，挑選“ Modify Animate Animate Selection”。 接下來完結“Animate dialog box”里的設置，選定動畫的幀數，動畫移動的方向、透明度等等設置。你也能夠點選“Frames”東西設置移動速度，挑選“Object”面板來改動設置。

　　要導出文件時，只需點選“ Optimize ”東西欄，在文件類型的地方挑選“Animated GIF”。完結今后，“Fireworks”就會主動將圖片以最佳化設置導出，而且主動將 GIF 圖片更新，還會在Dreamweaver里將更新過的圖片顯現出來。點選“File Preview in Browser”，這樣就能夠在瀏覽器里預覽剛剛制造完結的心愛圖片。

　　訣竅5：讓按鈕有閃爍作用

　　在Dreamweaver中，不必有Flashs，也能夠制造有閃爍作用的Flash按鈕物體。Dreamweaver內置有好幾個 Flash按鈕物體，能夠制造好幾個不同方式的按鈕。

　　具體做法：點選“Insert Interactive Images Flash Button”就可看到有那些內置按鈕。在對話框內乃至能夠用鼠標指到想要運用的按鈕方式，然后看看在瀏覽器里的作用如何。

　　用鼠標指針把要用的按鈕方式選定，再依順序輸入參數，例如按鈕上的文字、字形、色彩、超鏈接等，或是自設文件姓名。按下OK。接下來就會有一個“SWF”格局的文件產生，文件并會主動導入你的網頁中。按一下這個做好的文件，會看到“Property Inspector”（特點明細）中會顯現出文件的特點。將文件特點顯現出來時，假如擴展文件特點明細表，會呈現“Play”（播映），點選之后能夠不必翻開瀏覽器來預覽按鈕的閃爍作用。

　　訣竅6：制造活動文字

　　在網頁中添加活動文字就像添加咱們剛剛介紹的Flash按鈕相同簡略。相同地，不必裝置Flash，用 Dreamweaver供給的新功用就能夠輕松辦到。常用HTML語法寫網頁、沒有互動式媒體經驗的網頁制造者也能夠輕松制造出小巧的Flash方式的活動文字。這項新功用能夠在不添加相兼容性費事的狀況下為網頁增加一些瀏覽上與訪客的互動性。

　　具體做法：點選“Insert Interactive Images Flash Text”，再將參數設置一一填入（例如要更改作用的文字、字形、字體色彩及字體巨細等等）。