- 相關推薦
怎么用Dreamweaver設計網頁
DW是集網頁制作和管理網站于一身的所見即所得網頁代碼編輯器。以下是小編為大家整理的怎么用Dreamweaver設計網頁相關內容,僅供參考,希望能夠幫助大家。
怎么用Dreamweaver設計網頁1
1、靈活運用樣式
熟悉網頁設計的同學就知道,調用Style的方法很多,我們可以單擊鼠標右鍵選擇Custon Style來調用Style標準,也可以在狀態欄中的元素列表上單擊右鍵來調用Style。雖然不同的方法達到的效果看似一樣,但實際上產生的HTML代碼則完全不同。比如用Custon Style來調用Style標準,在網頁代碼中就生成一個〈span〉標簽,這樣的標簽一多就會使文件十分臃腫而且影響瀏覽器的解析速度,所以我們應盡量使用狀態欄中的元素列表來調用Style。
2、活用Format Table命令
在復雜的網頁設計中,表格的應用是最多的,因為利用表格可以自由地控制文本和圖象在網頁上出現的具體位置,從而使整個網頁看上去緊湊統一。Dreamweaver在這方面也不甘落后,我們可以使用其中的“Format Table”(格式化表格)命令來快速地對表格應用預先設計好的`樣式。要使用預先設計好的樣式,先將光標置于表格的任意一個單元格內,再選擇CommandFormat Table命令, 在隨后出現的對話框中,從左邊的列表中選擇一個設計方案。按Apply 鍵來查看效果,如果不滿意的話,還可以重新設置或者修改部分參數的值,如邊界粗細,背景顏色等等。
3、同時鏈接到兩個網頁
我們都知道超級鏈接一次只能連到一個頁面。如果我們要想一次在不同的框架頁中打開文檔,可以使用Go To URLJavaScript 行為。打開一個有框架的網頁,選擇文字或圖象,然后從行為面板中選擇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圖象格式的文件。
怎么用Dreamweaver設計網頁2
1、雙擊打開Dreamweaver這款軟件,進入Dreamweaver的操作界面。點擊上方文件,下拉找到新建。
2、點擊新建后,選擇空白頁,文檔類型為HTML。布局為無,點擊右下角創建。結果如下圖所示。
3、頁面右側找到插入選項,點擊他。并將它拉伸變長,找到表格選項。
4、對話框彈出后,設置表格大小。行:3,列:1,其余暫時不變。完成后點擊確定。
5、在設計視圖可看到,我們設置的3行1列的表格。在代碼視圖可看到,設置3行1列表格的代碼,我們繼續在設計視圖進行操作。
6、點擊表格內部,下方出現表格設置。在表格第一行輸入網頁的標題文字,隨后點擊下方,水平:居中對齊,垂直:居中。并設置表格寬高,此時寬為51。
7、將鼠標光標放在表格第二行,點擊右側圖像,下拉后第一行點擊圖像。
8、對話框出來后,在下方文件名中輸入,插入圖片的名稱,點擊確定即可。
9、在表格第三行,輸入文字:我的鏈接。并在后面附上鏈接,可復制可手工輸入。
10、點擊上方文件,找到保存選項,點擊保存。然后在對話框中輸入此文件名,并保存在你容易找得到的.地方,在點擊確定即可。
11、點擊上方,像地球一樣的圖標,下拉后,點擊在IE瀏覽器中預覽,也可以在自行安裝的瀏覽器中預覽。
【怎么用Dreamweaver設計網頁】相關文章:
Dreamweaver如何制作網頁設計03-03
Dreamweaver網頁設計制作的技巧03-19
用Dreamweaver為網頁進行優化11-25
網頁設計中的Dreamweaver重要嗎11-27
用Dreamweaver設計網頁時組織CSS的建議11-26
Dreamweaver動態網頁03-27