這篇文章給大家分享的是有關(guān)dreamweaver如何利用預(yù)設(shè)模板來架構(gòu)一個網(wǎng)站的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
站在用戶的角度思考問題,與客戶深入溝通,找到南豐網(wǎng)站設(shè)計與南豐網(wǎng)站推廣的解決方案,憑借多年的經(jīng)驗,讓設(shè)計與互聯(lián)網(wǎng)技術(shù)結(jié)合,創(chuàng)造個性化、用戶體驗好的作品,建站類型包括:成都做網(wǎng)站、網(wǎng)站建設(shè)、外貿(mào)營銷網(wǎng)站建設(shè)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機端網(wǎng)站、網(wǎng)站推廣、域名注冊、網(wǎng)站空間、企業(yè)郵箱。業(yè)務(wù)覆蓋南豐地區(qū)。dreamweaver提供了快速建立網(wǎng)站框架的方式,我們可以通過簡單預(yù)設(shè)模板來達到快速的架構(gòu)一個簡易網(wǎng)站的目的??纯聪旅孢@個網(wǎng)頁的基本結(jié)構(gòu),這是我們今天的目標(biāo),左側(cè)導(dǎo)航欄,右側(cè)顯示主頁面。
步驟
1、打開dreamweaver,按快捷鍵“ctr+N”來到“新建文檔”界面,我們新建一個基本html頁面。
2、在這個頁面中輸入du小策,作為小策的個人頁面。
3、接下來為小策插入一張藝術(shù)照。
4、暫且完成了這個簡單的頁面,一會要用到。
5、同樣的方法給du幫幫建一個個人頁面。
6、接著將這兩個文件存起來。按快捷鍵“trl+s”,彈出這個對話框。文件名設(shè)為du小策,然后點擊確定。
以同樣的方法把幫幫存起來,以后備用。
7、按快捷鍵“ctrl+n”新建一個頁面。點擊圖中所示的位置,選擇布局。
8、在標(biāo)簽欄選擇框架類型,如圖所示,這是頁面的整體布局,左側(cè)是預(yù)覽圖,右側(cè)hi名稱,我們選擇第一個作為示范。
9、彈出了一個對話框,這個對話框要對頁面的各個部分進行命名,這一步比較重要,一會我們要用到,所以看準(zhǔn),左欄叫做leftframe,右欄叫做mainframe。
10、在左側(cè)輸入百度經(jīng)驗,du小策,du幫幫,在右側(cè)主頁面輸入百度經(jīng)驗。此頁面的輸入和word的輸入沒有區(qū)別,就是直接打字,回車就是換行。我們看到下圖的樣子,左欄為導(dǎo)航欄,就是我們平時在網(wǎng)頁上看到的導(dǎo)航。
11、點擊“文件”——全部保存,記住這一步不是“ctrl+s”,因為框架頁面是有兩個頁面構(gòu)成的,所以要選擇全部保存。
12、彈出了一個保存對話框,這一步非常重要,接下來還會彈出兩個這樣的對話框。那么這第一個是整個頁面的,第二個對話是右欄的,第三個是左側(cè)導(dǎo)航,他們分別儲存于不同的文件中。
13、看看效果,把鼠標(biāo)放在不同的部分,標(biāo)簽欄上會出現(xiàn)不同的文件名稱。
14、接下來我們要對左側(cè)導(dǎo)航建立鏈接。選中左欄中“百度經(jīng)驗”,點擊右下角的一個圓圈,拖動圓圈到右面的相應(yīng)文件,這樣就建立了一個鏈接。接著在界面的下面選擇目標(biāo)為mainframe。mainframe是我們在第九步中命名的右側(cè)欄的名字,你可以返回去看看。百度經(jīng)驗這四個字建立了鏈接指向“右側(cè).html”這個文件,同時這個文件將在mainframe這個位置打開,也就是在右欄打開。
15、同樣的方式給小策和幫幫建立鏈接。分別指向“du小策.html”、“du幫幫.html”這兩個文件。
16、我們按快捷鍵F12,預(yù)覽界面,看看這是打開了主頁面“百度經(jīng)驗”
17、點擊“du小策”這個鏈接
18、點擊“du幫幫”這個鏈接,看看效果。這個小網(wǎng)站的基本框架就建構(gòu)好了。
感謝各位的閱讀!關(guān)于“dreamweaver如何利用預(yù)設(shè)模板來架構(gòu)一個網(wǎng)站”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學(xué)到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!