Dreamweaver網頁設計技巧

一、靈活運用樣式web

  熟悉網頁設計的網友就知道,調用Style的方法不少,咱們能夠單擊鼠標右鍵選擇Custon Style來調用Style標準,也能夠在狀態欄中的元素列表上單擊右鍵來調用Style。雖然不一樣的方法達到的效果看似同樣,但實際上產生的HTML代碼則徹底不一樣。好比用Custon Style來調用Style標準,在網頁代碼中就生成一個〈span〉標籤,這樣的標籤一多就會使文件十分臃腫並且影響瀏覽器的解析速度,因此咱們應儘可能使用狀態欄中的元素列表來調用Style。瀏覽器

  二、活用Format Table命令框架

  在複雜的網頁設計中,表格的應用是最多的,由於利用表格能夠自由地控制文本和圖象在網頁上出現的具體位置,從而使整個網頁看上去緊湊統一。Dreamweaver在這方面也不甘落後,咱們可使用其中的「Format Table」(格式化表格)命令來快速地對錶格應用預先設計好的樣式。要使用預先設計好的樣式,先將光標置於表格的任意一個單元格內,再選擇「Command」→「Format Table」命令, 在隨後出現的對話框中,從左邊的列表中選擇一個設計方案。按「Apply」 鍵來查看效果,若是不滿意的話,還能夠從新設置或者修改部分參數的值,如邊界粗細,背景顏色等等。字體

  三、同時連接到兩個網頁url

  咱們都知道超級連接一次只能連到一個頁面。若是咱們要想一次在不一樣的框架頁中打開文檔,可使用「Go To URL」JavaScript 行爲。打開一個有框架的網頁,選擇文字或圖象,而後從行爲面板中選擇「Go To URL」。咱們會注意到Dreamweaver會在「Go To URL」對話框中顯示全部可用的框架。選擇其中一個咱們想連接的框架並輸入相應的URL後再選擇另外一個框架並輸入另外一個URL。spa

  四、不給文件起中文名稱設計

  你們在製做好了網頁後,一般會給網頁起一個具備表明性的中文名稱,一來能令人一看文件名就能大概瞭解文件所包含的內容,二來可以方便各個超級連接之間的相互調用。但若是你在Dreamweaver中這樣作,就會發現Dreamweaver對中文文件名支持得不是太好,常常會有頁面調用不正確的現象發生,因此咱們之後在Dreamweaver中保存網頁的時候,儘可能用英文或者數字做爲文件名稱,這樣就能夠避免上面的出錯現象。orm

  五、巧妙設置字體分辨率對象

  咱們在製做網頁的時候,常常有這種體會,那就是製做好的網頁在本地計算機上瀏覽時很正常,但在另一臺計算機上瀏覽時發現本來漂亮的網頁變得歪歪扭扭了,這是爲何呢?原來各個計算機的分辨率要使你的主頁在不一樣的分辨率下都能正常顯示,在 Dreamweaver中獲得了較好的解決。在文檔窗口的右下角,Dreamweaver 顯示當前文檔被設計成的分辨率大小。單擊哪一個數字,在彈出式菜單中能夠爲當前的頁面指定顯示分辨率,經過修改可使你的主頁更具靈活性。使不一樣分辨率的顯示器都能較好地顯示。ip

  六、巧妙隱藏標籤

  若是在網頁中插入了不可見的元素時,Dreamweaver會自動在頁面上添加一個與之相應的元素標籤,以便於咱們選擇不可見元素。但這並不全是件好事,好比咱們在一個有不少層的頁面中的第一行便插入一個表格,就會發現因爲首行排列了太多的層元素標籤而使得表格自動退到了頁面的第二行,雖然在瀏覽時並不影響效果,但這確確實實會阻礙咱們的工做。因此當咱們以爲某個元素標籤礙手礙腳時,就索性將之屏蔽掉。方法是按Ctrl+U打開Preferences面板,在Category中選中Invisibel Elements,在面板的右邊將會出現全部的元素標籤。只要將不須要的元素標籤前的勾去掉,之後它就保證不會再出現了。

  七、善用拖放技巧

  咱們在使用Dreamweaver編輯網頁的時候,常常須要插入一些圖象什麼的,假設要插入的圖象不少,按照常規方法來操做就顯得很是麻煩。咱們能夠利用拖放技巧來很好地解決這個問題。首先咱們把Dreamweaver的操做窗口變成活動窗口,以騰出空間來顯示Explorer窗口,找到要插入的圖象文件後,把它們一一用鼠標拖動到網頁的適當部位,Dreamweaver將自動把這些圖象的url添加到文件的HTML代碼中,固然這裏要求被拖動的圖象文件必須是gif、jpg等web圖象格式的文件。對於已經在網頁中的圖象也是同樣,直接拖過來就能夠了。但若是被拖動的圖象上有超級連接,就不能夠再使用拖動技術了,由於那時拖過來的僅僅是超級連接地址。

  八、自動設置更新時間

  咱們知道一個網頁要想得到更多的回頭率,一個很重要的一條就是要不斷更新。但對於咱們這些我的網頁來講,要每天及時更新恐怕不是很容易的事情。所以,咱們但願網頁能自動更新,下面筆者就提供一個能自動更新修改時間的源代碼,咱們只要把這段源代碼添加到…< /BODY>之間就能實現更新時間的目的了:

  < Script Language="JavaScript"> < /script>;二是用鼠標依次單擊Dreamweaver中的Text/Custom Style/Edit/Style Sheet/New/Redefine HTML Tag,並從中選擇a,而後在decoration中選中none,最後單擊肯定就成功了。

  十二、巧妙複製文字

  在幾個不一樣的應用程序中間相互複製文字,是咱們在實際工做中可能要常作的事情。可是,若是咱們從Dreamweaver中複製編輯區中的文字到另一個應用程序的時候,HTML代碼和文字將一塊兒被複制過去了,那麼咱們該如何才能只把編輯區中的文字複製下來呢?咱們知道,一般複製時都用快捷鍵 Ctrl - C 來操做,若是咱們在複製的時候多按一個C鍵,那麼Dreamweaver將只會複製選中的文字了。

  1三、善用快捷鍵

  爲了提升操做的效率,咱們能夠在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

  1四、自動關閉網頁

  若是咱們但願本身的網頁在指定的時間內能自動關閉,不妨在網頁源代碼中的標籤後面加入以下代碼: < script LANGUAGE="JavaScript"> < /script>其中代碼中的3000表示3秒鐘,它是以毫秒爲單位的。

  1五、巧妙設置對象名稱

  咱們在用Dreamweaver來製做很是複雜的效果時,有可能須要常常重複地使用某一個或者多個對象,例如咱們常常須要定位某個特定的表格、圖象等,若是咱們沒有給某一個網頁中的多個對象取名的話,那麼在重複應用這些對象的時候,可能很麻煩或者容易出錯。爲了可以方便調用這些對象,咱們應該在每建立一個新的對象時,都記得給它取一個有表明性並且比較容易記憶的名稱。在給這些對象命名時,咱們能夠經過對象的「屬性」面板來操做就好了。

  1六、爲圖象連接增長動態效果

  有時咱們爲了要達到一種逼真的效果,但願鼠標移動到某個連接上時能有動感產生。使用Dreamweaver能夠很容易實現這種效果。設計時,咱們首先須要準備兩幅圖象,第一幅是原始圖象,第二幅是鼠標移動上去後的圖象。接着用鼠標單擊第一幅圖,在屬性面板中的連接欄中填上要連接的文件,而後單擊鍵盤上的F8鍵,在彈出的Behaviors窗口中單擊「+」號,隨後選擇「swap image」,在接着出現的窗口中選擇第二幅圖象,最後單擊肯定就能夠了。

相關文章
相關標籤/搜索