dw網(wǎng)頁小技巧

以下就是dw網(wǎng)頁設(shè)計小技巧等等的介紹，希望為您帶來幫助。



一、建立站點

建立一個規(guī)范整潔的站點文件夾是一個網(wǎng)站以后能夠順利運行的根本，也是開始制作網(wǎng)頁的第一步。在建立站點時，我們通常會用到三個文件夾，一個是files，用來存放除首頁之外的其它網(wǎng)頁文件，另一個是images，用來存放我們網(wǎng)頁制作中用到的圖片文件。最后一個是others，用來存放視頻、音頻、文本和動畫等網(wǎng)頁元素。之所以這樣做的原因是一個清晰的站點結(jié)構(gòu)決定了以后這個站點的方便與否。另外注意文件夾和文件的命名要以英文命名，這樣可以避免頁面調(diào)用不正確的現(xiàn)象發(fā)生。

二、巧妙復(fù)制文字

在幾個不同的應(yīng)用程序中間相互復(fù)制文字，是我們在實際工作中可能要常做的事情。但是，假如我們從Dreamweaver中復(fù)制編輯區(qū)中的文字到另外一個應(yīng)用程序的時候，HTML代碼和文字將一起被復(fù)制過去了，那么我們該如何才能只把編輯區(qū)中的文字復(fù)制下來呢?我們知道，通常復(fù)制時都用快捷鍵Ctrl+C來操作，假如我們在復(fù)制的時候多按一個C鍵，那么Dreamweaver將只會復(fù)制選中的文字了。

三、巧妙設(shè)置字體分辨率

我們在制作網(wǎng)頁的時候，經(jīng)常有這種體會，那就是制作好的網(wǎng)頁在本地計算機上瀏覽時很正常，但在另外一臺計算機上瀏覽時發(fā)現(xiàn)原本漂亮的網(wǎng)頁變得歪歪扭扭了，這是為什么呢?原來各個計算機的分辨率要使你的主頁在不同的分辨率下都能正常顯示，在Dreamweaver中得到了較好的解決。在文檔窗口的右下角，Dreamweaver顯示當(dāng)前文檔被設(shè)計成的分辨率大小。單擊哪個數(shù)字，在彈出式菜單中可以為當(dāng)前的頁面指定顯示分辨率，通過修改可以使你的主頁更具靈活性。使不同分辨率的顯示器都能較好地顯示。

四、善用快捷鍵

為了提高操作的效率，我們可以在Dreamweaver中使用快捷鍵，例如使用Ctrl+B或Ctrl+I來為文字應(yīng)用黑體或斜體格式，也可以使用以下一些鍵盤快捷鍵來為選中的文本應(yīng)用HTML格式：Ctrl+0(無格式);Ctrl+T(段落);Ctrl+1(標(biāo)題1);Ctrl+2(標(biāo)題2);Ctrl-+3(標(biāo)題3);Ctrl+4(標(biāo)題4);Ctrl+5(標(biāo)題5);Ctrl+6(標(biāo)題6)。

五、靈活運用樣式

熟悉網(wǎng)頁設(shè)計的人就知道，調(diào)用Style的方法很多，我們可以單擊鼠標(biāo)右鍵選擇CustonStyle來調(diào)用Style標(biāo)準(zhǔn)，也可以在狀態(tài)欄中的元素列表上單擊右鍵來調(diào)用Style。雖然不同的方法達到的效果看似一樣，但實際上產(chǎn)生的HTML代碼則完全不同。比如用CustonStyle來調(diào)用Style標(biāo)準(zhǔn)，在網(wǎng)頁代碼中就生成一個〈span〉標(biāo)簽，這樣的標(biāo)簽一多就會使文件十分臃腫而且影響瀏覽器的解析速度，所以我們應(yīng)盡量使用狀態(tài)欄中的元素列表來調(diào)用Style。

利用Dreamweaver制作網(wǎng)頁的常用小技巧

1、輸入輸入連續(xù)空格

網(wǎng)頁編輯時經(jīng)常需要輸入一些空格，例如在每段的開頭，一般都要空兩個格，而Dreamweaver與Word等常用辦公軟件不同，直接按空格鍵無法達到預(yù)期目的，但可以通過下面三個方法來實現(xiàn)空格的輸入：1)切換到中文輸入狀態(tài)，把標(biāo)點狀態(tài)設(shè)置為全角中文，就可以隨心所欲地輸入任意多個空格了。2)光標(biāo)定位需要輸入空格的位置，轉(zhuǎn)換到代碼視圖中，在HTML源文檔中輸入
;
，一個
;
相當(dāng)于一個空格，要添加多少個空格，只需要添加相應(yīng)的多少個
;
即可。3)在
插入
欄中選擇
文本
選項卡，在插入
字符
里選擇空格，這種方法可行，但不好用。

2、善用拖放技巧

我們在使用Dreamweaver編輯網(wǎng)頁的時候，經(jīng)常需要插入一些圖象什么的，假設(shè)要插入的圖象很多，按照常規(guī)方法來操作就顯得非常麻煩。我們可以利用拖放技巧來很好地解決這個問題。首先我們把Dreamweaver的操作窗口變成活動窗口，以騰出空間來顯示Explorer窗口，找到要插入的圖象文件后，把它們一一用鼠標(biāo)拖動到網(wǎng)頁的適當(dāng)部位，Dreamweaver將自動把這些圖象的url添加到文件的HTML代碼中，當(dāng)然這里要求被拖動的圖象文件必須是gif、jpg等web圖象格式的文件。對于已經(jīng)在網(wǎng)頁中的圖象也是一樣，直接拖過來就可以了。但假如被拖動的圖象上有超級鏈接，就不可以再使用拖動技術(shù)了，因為那時拖過來的僅僅是超級鏈接地址。

3、巧妙設(shè)置對象名稱

我們在用Dreamweaver來制作非常復(fù)雜的效果時，有可能需要經(jīng)常重復(fù)地使用某一個或者多個對象，例如我們經(jīng)常需要定位某個特定的表格、圖象等，假如我們沒有給某一個網(wǎng)頁中的多個對象取名的話，那么在重復(fù)應(yīng)用這些對象的時候，可能很麻煩或者輕易出錯。為了能夠方便調(diào)用這些對象，我們應(yīng)該在每創(chuàng)建一個新的對象時，都記得給它取一個有代表性而且比較輕易記憶的名稱。在給這些對象命名時，我們可以通過對象的
屬性
面板來操作就可以了。

4、為圖象鏈接增加動態(tài)效果

有時我們?yōu)榱艘_到一種逼真的效果，希望鼠標(biāo)移動到某個鏈接上時能有動感產(chǎn)生。使用Dreamweaver可以很輕易實現(xiàn)這種效果。設(shè)計時，我們首先需要預(yù)備兩幅圖象，第一幅是原始圖象，第二幅是鼠標(biāo)移動上去后的圖象。接著用鼠標(biāo)單擊第一幅圖，在屬性面板中的鏈接欄中填上要鏈接的文件，然后單擊鍵盤上的F8鍵，在彈出的Behaviors窗口中單擊
+
號，隨后選擇
swapimage
，在接著出現(xiàn)的窗口中選擇第二幅圖象，最后單擊確定就可以了。

5、靈活使用網(wǎng)頁表格

在使用Dreamweaver制作主頁的時候往往需要改變表格的高度。然而有時當(dāng)我們拖動表格的邊框，無論怎樣拖動，等到放下鼠標(biāo)，表格卻又恢復(fù)到原來的樣子。出現(xiàn)這種情況的原因在于我們已經(jīng)為表格提供了一個固定的高度，當(dāng)我們要改變表格的高度，尤其是壓縮表格的時候，表格的高度仍然保持原來的設(shè)定值，其直觀表象就是無論你怎樣拖動表格的邊框，表格的高度都不會變化。在這種情況下，我們只需要去除掉表格高度的設(shè)定，然后拖動表格的邊框就可以了。那么應(yīng)該如何去除表格的高度設(shè)置呢?首先需要選定表格，選定了表格以后，在屬性框中點擊一下
清除行高
圖標(biāo)(圖中加框處的按鈕)，表格的高度設(shè)定值就被取消了。這時表格的高度會按照表格的內(nèi)容自動匹配高度。

當(dāng)然刪除表格高度的方法不只上述一種方法，我們也可以選中表格，在表格的屬性框中直接刪除掉表格的高度值。同樣，該方法也適用于改變表格的寬度的情況，只不過，選定了表格以后，刪除的不是行的高度，而是列的寬度。這樣，就可以輕松進行調(diào)整表格的高度了。

dreamweaver的操作技巧

1、熟悉網(wǎng)頁設(shè)計的網(wǎng)友就知道，調(diào)用STYLE的方法很多，我們可以單擊鼠
標(biāo)右鍵選擇CUSTON
STYLE來調(diào)用STYLE標(biāo)準(zhǔn)，也可以在狀態(tài)欄中的元素列表
上單擊右鍵來調(diào)用STYLE。雖然不同的方法達到的效果看似一樣，但實際上
產(chǎn)生的HTML代碼則完全不同。比如用CUSTON
STYLE來調(diào)用STYLE標(biāo)準(zhǔn)，在網(wǎng)
頁代碼中就生成一個〈SPAN〉標(biāo)簽，這樣的標(biāo)簽一多就會使文件十分臃腫
而且影響瀏覽器的解析速度，所以我們應(yīng)盡量使用狀態(tài)欄中的元素列表來
調(diào)用STYLE。

2、使字體適應(yīng)不同的分辨率我們在制作網(wǎng)頁的時候，經(jīng)常有這種體會，
那就是制作好的網(wǎng)頁在本地計算機上瀏覽時很正常，但在另外一臺計算機
上瀏覽時發(fā)現(xiàn)原本漂亮的網(wǎng)頁變得歪歪扭扭了，這是為什么呢?原來各個
計算機的分辨率要使你的主頁在不同的分辨率下都能正常顯示，在
DREAMWEAVER中得到了較好的解決。在文檔窗口的右下角，DREAMWEAVER
顯示當(dāng)前文檔被設(shè)計成的分辨率大小。單擊哪個數(shù)字，在彈出式菜單中可
以為當(dāng)前的頁面指定顯示分辨率，通過修改可以使你的主頁更具靈活性。
使不同分辨率的顯示器都能較好地顯示。



3、善用拖放技術(shù)我們在使用DREAMWEAVER編輯網(wǎng)頁的時候，經(jīng)常需要
插入一些圖象什么的，假設(shè)要插入的圖象很多，按照常規(guī)方法來操作就顯
得非常麻煩。我們可以利用拖放技巧來很好地解決這個問題。首先我們把
DREAMWEAVER的操作窗口變成活動窗口，以騰出空間來顯示EXPLORER窗口，
找到要插入的圖象文件后，把它們一一用鼠標(biāo)拖動到網(wǎng)頁的適當(dāng)部位，
DREAMWEAVER將自動把這些圖象的URL添加到文件的HTML代碼中，當(dāng)然這里
要求被拖動的圖象文件必須是GIF、JPG等WEB圖象格式的文件。對于已經(jīng)在
網(wǎng)頁中的圖象也是一樣，直接拖過來就可以了。但如果被拖動的圖象上有
超級鏈接，就不可以再使用拖動技術(shù)了，因為那時拖過來的僅僅是超級鏈
接地址。

4、善于為對象取名我們在用DREAMWEAVER來制作非常復(fù)雜的效果時，
有可能需要經(jīng)常重復(fù)地使用某一個或者多個對象，例如我們經(jīng)常需要定位
某個特定的表格、圖象等，如果我們沒有給某一個網(wǎng)頁中的多個對象取名
的話，那么在重復(fù)應(yīng)用這些對象的時候，可能很麻煩或者容易出錯。為了
能夠方便調(diào)用這些對象，我們應(yīng)該在每創(chuàng)建一個新的對象時，都記得給它
取一個有代表性而且比較容易記憶的名稱。在給這些對象命名時，我們可
以通過對象的
屬性
面板來操作就行了。

5、一次鏈接到兩個網(wǎng)頁我們都知道超級鏈接一次只能連到一個頁面。
如果我們要想一次在不同的框架頁中打開文檔，可以使用
GO
TO
URL
JAVASCRIPT行為。打開一個有框架的網(wǎng)頁，選擇文字或圖象，然后從行為
面板中選擇
GO
TO
URL
。我們會注意到DREAMWEAVER會在
GO
TO
URL
對話框中顯示所有可用的框架。選擇其中一個我們想鏈接
的框架并輸入相應(yīng)的URL后再選擇另一個框架并輸入另一個URL。

6、利用
FORMAT
TABLE
命令來修飾網(wǎng)頁在復(fù)雜的網(wǎng)頁設(shè)計中，表格
的應(yīng)用是最多的，因為利用表格可以自由地控制文本和圖象在網(wǎng)頁上出現(xiàn)
的具體位置，從而使整個網(wǎng)頁看上去緊湊。DREAMWEAVER在這方面也不
甘落后，我們可以使用其中的
FORMAT
TABLE
(格式化表格)命令來快
速地對表格應(yīng)用預(yù)先設(shè)計好的樣式。要使用預(yù)先設(shè)計好的樣式，先將光標(biāo)
置于表格的任意一個單元格內(nèi)，再選擇
COMMAND
FORMAT
TABLE
命
令，在隨后出現(xiàn)的對話框中，從左邊的列表中選擇一個設(shè)計方案。按
APPLY
鍵來查看效果，如果不滿意的話，還可以重新設(shè)置或者修改部分
參數(shù)的值，如邊界粗細，背景顏色等等。

7、盡量不要給文件起中文名稱大家在制作好了網(wǎng)頁后，通常會給網(wǎng)頁
起一個具有代表性的中文名稱，一來能使人一看文件名就能大概了解文件
所包含的內(nèi)容，二來能夠方便各個超級鏈接之間的相互調(diào)用。但如果你在
DREAMWEAVER中這樣做，就會發(fā)現(xiàn)DREAMWEAVER對中文文件名支持得不是
太好，經(jīng)常會有頁面調(diào)用不正確的現(xiàn)象發(fā)生，所以我們以后在DREAMWEAVER
中保存網(wǎng)頁的時候，盡量用英文或者數(shù)字作為文件名稱，這樣就可以避免上
面的出錯現(xiàn)象。

8、經(jīng)常保存當(dāng)前被編輯的文件有網(wǎng)友說經(jīng)常保存文件是不是怕突然死
機呀?這話當(dāng)然沒錯，但我們在DREAMWEAVER中要經(jīng)常保存文件還有它特別
的意義。因為我們在設(shè)計主頁的時候，DREAMWEAVER會跟蹤我們對文件作出
的任何改動，也就是說即使我們在主頁中簡單地移動了一下某個對象，
DREAMWEAVER也能生成大量的臨時源代碼，想象一下，如果在主頁中作了
很多改變，那么生成的這些大量代碼就變得很難管理，從而會影響系統(tǒng)的
性能。因此我們發(fā)現(xiàn)如果DREAMWEAVER的性能開始降低，這可能是由于駐
留在內(nèi)存中的大量代碼變得太龐大的緣故，只要保存一下文件，就會使這
些臨時代碼消失，從而提高性能，所以以后我們在使用DREAMWEAVER時，
要有經(jīng)常保存文件的習(xí)慣。

DW制作網(wǎng)頁的基本步驟

1、在Dreamveaver中
文件
新建
常規(guī)
基本頁
HTML
，這就建好了一個頁面，英文版的默認(rèn)為文件名untitled.htm。中文版的默認(rèn)為文件名
無標(biāo)題文檔
。htm表示的是這個網(wǎng)頁文件是一個靜態(tài)的HTML文件?？梢越o它改名為index.htm。

2、在標(biāo)題空格那里輸入網(wǎng)頁的名稱，點擊
頁面屬性，打開這個窗口后在這里可以設(shè)置網(wǎng)站標(biāo)題、背景顏色還有背景圖像，超級鏈接顏色，其他都保持默認(rèn)值就可以了。

3.這個時候光標(biāo)在左上角，你可以輸入一句話，如
歡迎大家來到我的主頁
，用文字，用菜單
窗口/屬性
打開屬性面板，取文字的大小，再把文字設(shè)置為居中，然后在文字的前面敲幾下回車就位于頁面中間了。

4.要選取字體，即選擇字體中的最后一項：即編輯字體列表。然后在對話框中選+號，接著在
可用字體
欄中選擇需要加入到字體，點擊中間的按鈕就可以加入了。

注：在網(wǎng)頁上一般最常用的是就宋體字。切將特殊的字體加到列表中使用，因為可能別人的上沒有安裝看不到。如果有需要用的話，一定要做成圖片后再使用。

下面拿一個現(xiàn)成的例子來給大家說一下：

在開始做之前咱們先分析一下這個頁面，看看這里這個頁面用到了哪些東西。

網(wǎng)頁最頂端的標(biāo)題
我的主頁
這四個字。

網(wǎng)頁中間是一張圖片。

最下端的是歡迎詞。

網(wǎng)頁背景是一白色。

構(gòu)思好這個網(wǎng)頁的結(jié)構(gòu)，咱們就可以開始制作了。

首先啟動Dreamweaver，確保你已經(jīng)建好了一個網(wǎng)站。

為了制作方便，要事先打開資源管理器，把要用的圖片放到網(wǎng)站目錄images文件夾里。

【首先插入標(biāo)題文字】進入到頁面編輯中，設(shè)計視圖狀態(tài)。一般的情況下，編輯器的默認(rèn)方式是左對齊，光標(biāo)位于左上角，光標(biāo)所在的位置就是插入點的位置。如果想讓文字居中插入的話，點擊屬性按鈕就可以了。中文狀態(tài)下輸入
我的主頁
。字的大小沒關(guān)系，我們對它進行設(shè)置就可以了。

【設(shè)置文字的格式】先選中文字，在屬性面板中將字體格式設(shè)置成默認(rèn)字體，大小隨意更改。并選中
B
把字體加粗。

【設(shè)置文字的顏色】先選中文字，在屬性面板中，單擊顏色選擇圖標(biāo)，在彈出的顏色選擇器中用滴管選取顏色即可。

【設(shè)置網(wǎng)頁的標(biāo)題和背景顏色】點擊
修改
菜單中的
頁面屬性
。系統(tǒng)自動彈出頁面屬性的對話框，請在文本標(biāo)題輸入框內(nèi)填入標(biāo)題
我的主頁
。

【設(shè)置背景顏色】網(wǎng)頁的背景可以是圖片，當(dāng)然也可以是顏色。這個例子是顏色。如上所訴打開背景顏色選擇器進行選取。如果背景要設(shè)置為圖片，則點擊背景圖象
瀏覽
按鈕，系統(tǒng)自動彈出圖片選擇對話框，點擊圖片就可以了。

【插入圖像】選擇以下方法：

(1)插入菜單：在
插入
菜單選
圖像
，彈出
選擇圖像源文件
對話框，選中該圖像文件，單擊確定即可。

一個圖片就插入完畢了。

【輸入文本文字】在圖片右邊空白處有單擊，回車換行。仍然按照上面的方法，輸入文字
歡迎大家來到我的主頁
然后，對文字進行設(shè)置，保存頁面。

一個簡單的頁面就完成了。

【預(yù)覽網(wǎng)頁】在頁面編輯器中按F12預(yù)覽網(wǎng)頁效果。

網(wǎng)站的首頁一般我們通常存盤取名時為index.htm。