網站首頁 健康小知識 母嬰教育 起名 運動知識 職場理財 情感生活 綠色生活 遊戲數碼 美容 特色美食 愛好

怎樣用Dreamweaver製作網頁模板

欄目: IT技術 / 發佈於: / 人氣:2.38W

工具/材料

Adobe Dreamweaver cs6

操作方法

首先我們先打開軟件,然後新建一個HTML文件和一個css文件,然後依次點擊文件保存為、。方法如下:

怎樣用Dreamweaver製作網頁模板

一個網頁分為二部分,即head和body。網頁的標題(title)就是在在head裏面,標題出現的位置在瀏覽器的最上方。如下圖:

怎樣用Dreamweaver製作網頁模板 第2張

而body裏面就是設計網頁的主體內容了,不管是網頁的導航、內容、還是友情鏈接都是在body裏面。如下圖:

怎樣用Dreamweaver製作網頁模板 第3張

關聯css需要在Adobe Dreamweaver右下方,屬性裏面找到附加樣式表。如下圖:

怎樣用Dreamweaver製作網頁模板 第4張

然後會彈出一個連接外部樣式表,點擊瀏覽,找到剛才保存的文件,雙擊返回對方框後點擊確定,就會下代碼去裏面自動生成一段引入外部樣式代碼,即link。如下圖:

怎樣用Dreamweaver製作網頁模板 第5張

然後在Adobe Dreamweaver工具欄裏面就會出現剛才添加的style文件,然後在裏面輸入網頁樣式代碼。如下圖:

怎樣用Dreamweaver製作網頁模板 第6張

css裏面的代碼在html裏面調用,都是以div來調用,具體如下圖:

怎樣用Dreamweaver製作網頁模板 第7張

特別提示

設計網站前,一定要出效果圖哦