巧妙運用DW進行網頁製作技巧-熟悉網頁設計的網友就知道,呼叫Style的方法很多,我們可以點選滑鼠右鍵選擇Custon Style來呼叫Style標準,也可以在狀態列中的元素清單上點選右鍵來調用Style。雖然不同的方法達到的效果看似一樣,但實際上產生的HTML程式碼則完全不同。
1.靈活運用樣式
熟悉網頁設計的網友就知道,呼叫Style的方法很多,我們可以點選滑鼠右鍵選擇Custon Style來呼叫Style標準,也可以在狀態列中的元素列表上點選右鍵來呼叫Style。雖然不同的方法達到的效果看似一樣,但實際上產生的HTML程式碼則完全不同。例如用Custon Style來呼叫Style標準,在網頁程式碼中就產生一個〈span〉標籤,這樣的標籤一多就會使文件十分臃腫而且影響瀏覽器的解析速度,所以我們應盡量使用狀態列中的元素列表來呼叫Style。
2.活用Format Table指令
在複雜的網頁設計中,表格的應用是最多的,因為利用表格可以自由地控製文字和圖像在網頁上出現的具體位置,從而使整個網頁看上去緊湊統一。 Dreamweaver在這方面也不甘落後,我們可以使用其中的「Format Table」(格式化表格)指令來快速地對表格套用預先設計好的樣式。若要使用預先設計好的樣式,先將遊標置於表格的任一儲存格內,再選擇「Command」→「Format Table」指令, 在隨後出現的對話方塊中,從左邊的清單中選取一個設計方案。按下「Apply」 鍵來查看效果,如果不滿意的話,還可以重新設定或修改部分參數的值,如邊界粗細,背景顏色等等。
3.同時連結到兩個網頁
我們都知道超級連結一次只能連到一個頁面。如果我們要想一次在不同的框架頁面中開啟文檔,可以使用「Go To URL」JavaScript 行為。開啟一個有框架的網頁,選擇文字或圖象,然後從行為面板中選擇「Go To URL」。我們會注意到Dreamweaver會在「Go To URL」對話方塊中顯示所有可用的框架。選擇其中一個我們想連結的框架並輸入對應的URL後再選擇另一個框架並輸入另一個URL。
4.不給文件起中文名稱
大家在製作好了網頁後,通常會給網頁起一個具有代表性的中文名稱,一來能使人一看文件名就能大概了解文件所包含的內容,二來能夠方便各個超級連結之間的相互呼叫。但如果你在Dreamweaver中這樣做,你會發現Dreamweaver對中文文件名支持得不是太好,經常會有頁面調用不正確的現象發生,所以我們以後在Dreamweaver中保存網頁的時候,盡量用英文或者數字作為文件名稱,這樣就可以避免上面的出錯現象。
5.巧妙設定字體解析度
我們在製作網頁的時候,經常有這種體會,那就是製作好的網頁在本地電腦上瀏覽時很正常,但在另外一台電腦上瀏覽時發現原本漂亮的網頁變得歪歪扭扭了,這是為什麼呢?原來各個計算機的分辨率要使你的主頁在不同的分辨率下都能正常顯示,在Dreamweaver中得到了較好的解決。在文件視窗的右下角,Dreamweaver 顯示目前文件被設計成的解析度大小。點擊哪個數字,在彈出式選單中可以為當前的頁面指定顯示分辨率,透過修改可以使你的主頁更具靈活性。使不同解析度的顯示器都能較好地顯示。
6.巧妙隱藏標籤
如果在網頁中插入了不可見的元素時,Dreamweaver會自動在頁面上添加一個與之相應的元素標籤,以便於我們選擇不可見元素。但這並不全是件好事,例如我們在一個有很多層的頁面中的第一行便插入一個表格,就會發現由於首行排列了太多的層元素標籤而使得表格自動退到了頁面的第二行,雖然在瀏覽時並不影響效果,但這確確實實會阻礙我們的工作。所以當我們覺得某個元素標籤礙手礙腳時,就索性將之屏蔽掉。方法是按Ctrl+U開啟Preferences面板,在Category中選取Invisibel Elements,在面板的右邊將會出現所有的元素標籤。只要將不需要的元素標籤前的勾去掉,以後它就保證不會再出現了。
7.善用拖放技巧
我們在使用Dreamweaver編輯網頁的時候,經常需要插入一些圖象什麼的,假設要插入的圖像很多,按照常規方法來操作就顯得非常麻煩。我們可以利用拖放技巧來好好解決這個問題。首先我們把Dreamweaver的操作窗口變成活動窗口,以騰出空間來顯示Explorer窗口,找到要插入的圖象文件後,把它們一一用滑鼠拖動到網頁的適當部位,Dreamweaver將自動把這些圖象的url加入到檔案的HTML程式碼中,當然這裡要求被拖曳的圖象檔案必須是gif、jpg等web圖象格式的檔案。對於已經在網頁中的圖像也是一樣,直接拖過來就可以了。但如果被拖曳的圖像上有超級鏈接,就不可以再使用拖動技術了,因為那時拖過來的僅僅是超級鏈接地址。
8.自動設定更新時間
我們知道一個網頁要想獲得更多的回頭率,一個很重要的一條就是要不斷更新。但對於我們這些個人網頁來說,要天天及時更新恐怕不是很容易的事。因此,我們希望網頁能自動更新,下面筆者就提供一個能自動更新修改時間的源代碼,我們只要把這段源代碼添加到…< /BODY>之間就能實現更新時間的目的了:
< Script Language="JavaScript"> < /script>;二是用滑鼠依序點選Dreamweaver中的Text/Custom Style/Edit/Style Sheet/New/Redefine HTML Tag,並從中選取a,然後在decoration中選取none,最後點選確定就成功了。
12.巧妙複製文字
在幾個不同的應用程式中間相互複製文字,是我們在實際工作中可能要常做的事情。但是,如果我們從Dreamweaver複製編輯區中的文字到另外一個應用程式的時候,HTML程式碼和文字將一起被複製過去了,那麼我們該如何才能只把編輯區中的文字複製下來呢?我們知道,通常複製時都用快捷鍵Ctrl - C 來操作,如果我們在複製的時候多按一個C鍵,那麼Dreamweaver將只會複製選中的文字了。
13.善用快捷鍵
為了提高操作的效率,我們可以在Dreamweaver中使用快捷鍵,例如使用Ctrl-B或Ctrl-I來為文字應用黑體或斜體格式,也可以使用以下一些鍵盤快捷鍵來為選中的文字應用HTML格式:Ctrl-0: 無格式Ctrl-T: 段落Ctrl-1: 標題1 Ctrl-2: 標題2 Ctrl-3: 標題3 Ctrl-4: 標題4 Ctrl-5: 標題5 Ctrl-6 : 標題6
14、自動關閉網頁
如果我們希望自己的網頁在指定的時間內能自動關閉,不妨在網頁源代碼中的標籤後面加入如下代碼: < script LANGUAGE="JavaScript"> < /script>其中代碼中的3000表示3秒鐘,它是以毫秒為單位的。
15.巧妙設定對象名稱
我們在用Dreamweaver來製作非常複雜的效果時,有可能需要經常重複地使用某一個或多個對象,例如我們經常需要定位某個特定的表格、圖像等,如果我們沒有為某一個網頁中的多個物件取名的話,那麼在重複應用這些物件的時候,可能很麻煩或容易出錯。為了能夠方便地呼叫這些對象,我們應該在每創建一個新的對象時,都記得給它一個有代表性而且比較容易記憶的名稱。在為這些物件命名時,我們可以透過物件的「屬性」面板來操作就行了。
16.為圖象連結增加動態效果
有時我們為了要達到逼真的效果,希望滑鼠移動到某個連結上時能有動感產生。使用Dreamweaver可以輕鬆實現這種效果。設計時,我們首先需要準備兩幅圖象,第一幅是原始圖象,第二幅是滑鼠移動上去後的圖象。接著用滑鼠點選第一幅圖,在屬性面板中的連結欄中填上要連結的文件,然後點選鍵盤上的F8鍵,在彈出的Behaviors視窗中點選「+」號,隨後選擇「 swap image”,在接著出現的視窗中選擇第二幅圖象,最後按一下確定就可以了。