Dreamweaver教程全集介紹

更多資料：/nongmin1214更多資料：/nongmin1214Dreamweaver8基礎(chǔ)教程一、上網(wǎng)基礎(chǔ)學(xué)習(xí)做網(wǎng)頁之前，我們首先要知道網(wǎng)頁是什么，一般來說網(wǎng)頁是用在網(wǎng)絡(luò)上的htm文件，通過網(wǎng)頁可以很方便的實現(xiàn)網(wǎng)絡(luò)資源的共享，上網(wǎng)分為三個步驟。1、輸入正確的網(wǎng)址1）在桌面上找到InternetExplorer，雙擊打開，出現(xiàn)瀏覽器窗口，一般會自動進(jìn)入微軟的網(wǎng)站。2）找到地址欄一個長白條，里面有一串英文字母，后頭是“轉(zhuǎn)到”按鈕，這就是地址欄。3）在地址欄里頭點(diǎn)一下鼠標(biāo)左鍵，然后刪除里面的字符，輸入自己的的網(wǎng)址，網(wǎng)址一般是英文的以http打頭，然后是一個冒號和兩個斜杠（雙斜杠），然后是www（三W），后面跟一個點(diǎn)，最后一般是com結(jié)尾，例如輸入輸完檢查一下，沒問題就按一下回車鍵，或者點(diǎn)一下后邊的“轉(zhuǎn)到”按鈕，這時窗口右上角的小圖標(biāo)就開始運(yùn)動，也就是正在搜索。4)一切正常就會進(jìn)入到百度搜索的首頁。2、找超級鏈接網(wǎng)頁上的內(nèi)容是一頁一頁的，一般都藏在一個叫超鏈接的后面，所以第二步就是要找到超鏈接。超鏈接有三個特點(diǎn)，首先文字的顏色是藍(lán)色的，非常醒目，其次文字下面有一條下劃線，便于查找，最關(guān)鍵的是當(dāng)鼠標(biāo)移過去以后，指針會變成手形，這一點(diǎn)很重要。找到超鏈接以后就可以鼠標(biāo)左鍵單擊，進(jìn)入相應(yīng)的內(nèi)容了。3、后退按鈕看完一頁后如何返回呢？在窗口的左上角有一個后退按鈕，點(diǎn)一下就可以回到上一頁，這樣就不會迷失方向了。二、啟動程序安裝好以后，我們就可以使用它來制作自己的網(wǎng)頁，這一節(jié)我們來學(xué)習(xí)如何運(yùn)行Dreamweaver。1、新建文件夾在D:盤中給自己新建一個文件夾，文件名用自己名字的拼音字母，數(shù)量小于8個，以后自己的網(wǎng)頁都存這里頭。其他文件夾也可以，要求基本是名稱是英文，盡量不要用空格漢字等那些非標(biāo)準(zhǔn)字符。2、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8，2）第一次運(yùn)行會出來一個選擇面板，選默認(rèn)的“設(shè)計”，點(diǎn)“確定”即可。3）然后出來一個激活的頁面，如果有正式的序列號，點(diǎn)“繼續(xù)”即可，也可以選擇下面的30天免費(fèi)試用。正確輸入序列號后，在出來的注冊頁面中，點(diǎn)“以后提醒”按鈕即可。4）接下來開始載入Dreamweaver，直到出現(xiàn)一個完整的窗口。這個頁面稱作“起始頁”，中間是新建項目，我們一般選第一個Html普通網(wǎng)頁，新建一個空白文檔。三、創(chuàng)建網(wǎng)頁這一節(jié)我們來學(xué)習(xí)如何創(chuàng)建網(wǎng)頁，在基礎(chǔ)0課程我們認(rèn)識了網(wǎng)頁，下面我們通過一個練習(xí)來看看怎樣做一個網(wǎng)頁。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔。2、保存文件1）點(diǎn)菜單“文件－保存”命令，彈出一個“另存為”對話框，在上邊的保存在長條中，找到D:盤，在中間打開自己的文件夾。2）在下邊文件名那兒把Untitled-1刪除，改成index然后點(diǎn)右邊的“保存”按鈕。這兒注意兩點(diǎn)，一個是保存位置在自己的文件夾，一個是文件名改成index3）回到窗口，這時候在標(biāo)簽上就有了文件的名稱，然后在標(biāo)簽下面的文檔工具欄中間找到“標(biāo)題”。把標(biāo)題改一下，這個網(wǎng)頁內(nèi)容是個人主頁，把標(biāo)題改成“青青草”4）這樣我們就修改好了標(biāo)題，同時按下Ctrl和S鍵(Ctrl＋S組合鍵)，保存一下文件，標(biāo)簽上的星號消失。3、輸入內(nèi)容1）在中間工作區(qū)里點(diǎn)一下鼠標(biāo)，這是光標(biāo)在左上角一閃一閃，提示輸入內(nèi)容。輸入下面的三行內(nèi)容，輸完一行按一下回車鍵，輸完按Ctrl＋S保存一下文件。2）在標(biāo)簽下邊的文檔工具欄中，找到一個球體的預(yù)覽圖標(biāo)，點(diǎn)一下出來一個下拉列表：點(diǎn)第一個在IE瀏覽器中進(jìn)行瀏覽，如果沒保存，會出來一個提示，點(diǎn)“是”即可。看一下自己做的頁面，稍稍簡單些，后面我們會逐步學(xué)習(xí)網(wǎng)頁的修飾。四、基礎(chǔ)練習(xí)這一節(jié)我們來做網(wǎng)頁練習(xí)，標(biāo)題改成跟內(nèi)容相關(guān)，保存的文件名改成標(biāo)題的英文或拼音縮寫(不要超過8個字母)，保存到自己的文件夾中。內(nèi)容自定(三行左右)，在做下一個網(wǎng)頁之前，先點(diǎn)菜單“文件－關(guān)閉”命令，然后點(diǎn)“文件－新建”，再點(diǎn)右下角的創(chuàng)建命令，1）給自己的爸爸建一個網(wǎng)頁。2）給自己的媽媽建一個網(wǎng)頁。3）給自己的爺爺建一個網(wǎng)頁。4）給自己的奶奶建一個網(wǎng)頁。5）給自己的外公建一個網(wǎng)頁。6）給自己的外婆建一個網(wǎng)頁。7）給自己的哥哥建一個網(wǎng)頁。8）給自己的姐姐建一個網(wǎng)頁。9）給自己的弟弟建一個網(wǎng)頁。10）給自己的妹妹建一個網(wǎng)頁。五、新建站點(diǎn)網(wǎng)頁的內(nèi)容除了文字以外，還有圖片、音樂、動畫等等，它們共同構(gòu)成了一個網(wǎng)站，把它們聯(lián)系在一起的目錄頁稱作“主頁”，下面我們通過一個練習(xí)來學(xué)習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）啟動后顯示的是起始頁，窗口右邊和下邊都有一個側(cè)邊欄，側(cè)邊欄中間有個折疊按鈕。2、創(chuàng)建新站點(diǎn)在右邊的側(cè)邊欄中間，在文件面板上找到一個藍(lán)色的“管理站點(diǎn)”鏈接，點(diǎn)一下。出來一個“管理站點(diǎn)”的對話框，里面現(xiàn)在還是空的，點(diǎn)右上角的“新建”按鈕，選擇“站點(diǎn)”命令，出來一個面板。1）這時候就開始進(jìn)行站點(diǎn)的創(chuàng)建步驟，把中間站點(diǎn)的名字改為“青青草”，第二行的站點(diǎn)地址不動它，點(diǎn)“下一步”。2）在第二個頁面中，直接點(diǎn)“下一步”進(jìn)入第三頁，這兒不需要服務(wù)器技術(shù)。3）這時出來保存位置的對話框，點(diǎn)一下右邊的小包圖標(biāo)，找一下自己的文件夾。在出來的文件夾瀏覽對話框中，找到D:盤自己的文件夾，這時里面是空的，我們要新建一個文件夾，點(diǎn)一下右上角的小包“新建按鈕”，把文件夾的名稱改成字母縮寫。打開這個新建的qqc文件夾，點(diǎn)右下角的“選擇”按鈕即可，注意這時候上邊的位置里顯示的是“qqc”。這時候返回到頁面，中間顯示的是我們剛才選擇的保存文件夾(在開始的時候直接輸入也可以)，點(diǎn)“下一步”繼續(xù)。4）在中間的“本地/網(wǎng)絡(luò)”上點(diǎn)一下，彈出一個下拉列表，選擇第一個“無”，點(diǎn)“下一步”繼續(xù)。5）這時候就出來了“總結(jié)”頁面，顯示一下剛才的設(shè)置情況，點(diǎn)“完成”即可。6）這樣就新建好了一個站點(diǎn)，注意選擇文件夾那一步可以直接輸入進(jìn)去。這時候“管理站點(diǎn)”面板里頭就有了一個站點(diǎn)，點(diǎn)“完成”返回，在右邊的側(cè)邊欄中，也可以看到一個名為“青青草”的站點(diǎn)。由于是新建的，里面還是空的，后面我們會逐漸添加各個文件。六、編輯文字網(wǎng)頁的內(nèi)容大部分是文字，文字的屬性中包括、字體、字號和顏色等，下面我們通過一個練習(xí)來學(xué)習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔。3）點(diǎn)菜單“文件－保存”命令，把文件名改為index，位置保存在上次建的站點(diǎn)中，把標(biāo)題改為“青青草主頁”，保存一下文件，下面輸入內(nèi)容。2、設(shè)置文字1）輸入下面的內(nèi)容，輸完一行后按一下回車鍵(也可以寫自己的內(nèi)容)，輸完保存一下文件。2）下面設(shè)置文字格式，拖黑選中標(biāo)題“青青草”，在下面的側(cè)邊欄，屬性面板中找第二排的各個按鈕，依次是字體、大小、顏色。3）按從左到右的順序，把字體設(shè)為“黑體”、大小設(shè)成“24”、顏色設(shè)為綠色，標(biāo)題一般要醒目些。4）再拖黑選中下面的三行內(nèi)容，在下面的屬性面板中，把字體設(shè)為“新宋體”、大小為“18”、顏色為藍(lán)色。5）如果字體太少可以，點(diǎn)列表下邊的“編輯字體列表..”，添加其他字體，先在右邊的列表中找到字體，再點(diǎn)中間的<<按鈕添加到左邊，然后點(diǎn)上邊的加號按鈕，即可添加字體。6）設(shè)好以后，在屬性面板的第一排，“樣式”旁邊會出來一個STYLE2，這是自動保存了字體、字號、顏色的樣式表，下次可以直接用，不用再一個一個設(shè)了。在顏色按鈕的旁邊，有一串顏色代碼，用數(shù)字代表顏色，以井號#開頭的6個數(shù)字。七、對齊和背景接著上一課，這一節(jié)我們來學(xué)習(xí)文字的對齊方式，以及背景色的設(shè)置方法，下面我們通過一個練習(xí)來學(xué)習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔，把標(biāo)題改為“對齊”。3）以duiqi為文件名，保存一下文件，保存位置在我們建的站點(diǎn)文件夾里。2、輸入內(nèi)容1）輸下面的三行內(nèi)容，輸完一行后，按一下回車鍵。2）拖黑選中三行內(nèi)容，在下邊屬性面板第一排中，找到“居中”按鈕點(diǎn)一下，這樣文字就自動排到中間的位置，一般標(biāo)題放在居中的位置，保存一下文件。3、背景色1）默認(rèn)的背景色是白色，我們可以改成其他顏色。2）在下邊的屬性面板中，找到“頁面屬性..”按鈕，點(diǎn)一下出來一個面板。3）找到中間的“背景顏色”按鈕點(diǎn)一下，在出來的調(diào)色板中，選擇一個淡綠色，點(diǎn)“確定”背景色就設(shè)好了。調(diào)色板的右上角有三個按鈕，第一個是返回“默認(rèn)顏色”，第二個是“拾取顏色”，右邊的三角按鈕是一個菜單。保存一下文件，點(diǎn)“預(yù)覽”按鈕，看一下網(wǎng)頁的效果。插入背景圖片的方法，在背景顏色按鈕下面的背景圖片中選擇一幅圖片。八、插入圖片網(wǎng)頁中除了文字以外，往往還有一些漂亮的圖片，在Dreamweaver中如何插入圖片呢？下面我們通過一個練習(xí)來學(xué)習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔，把標(biāo)題改為“插入圖片”。3）點(diǎn)“文件－保存”命令，以tupian為文件名保存文件，保存位置在建立的站點(diǎn)中。2、插入圖片1）在右邊的側(cè)邊欄中間，在文件面板中找到“站點(diǎn)－青青草”，瞄準(zhǔn)敲右鍵，選“新建文件夾”命令，新建一個名為images的文件夾。2）這個images文件夾主要用來放圖片的，把要用的圖片復(fù)制到這個文件夾中，也可以直接拖進(jìn)去，圖片的文件名必須是英文的。在右鍵菜單里有個“編輯”菜單，這里面有“拷貝、粘貼、刪除、重命名”等命令。3）點(diǎn)常用工具欄中間的“插入圖像”按鈕，出現(xiàn)一個“選擇圖片”對話框，中間有一個文件夾images注意上面的“查找范圍”應(yīng)該是站點(diǎn)的文件夾，中間是images文件夾，打開它，選擇剛才復(fù)制進(jìn)去的圖片，點(diǎn)“確定”即可。如果插入的圖片不在站點(diǎn)內(nèi)，會出來一個復(fù)制的提示，這時候點(diǎn)“是”就可以了。4）保存一下文件，點(diǎn)預(yù)覽按鈕，看一下圖片的效果。另外一種更簡單的方法是，直接把右邊站點(diǎn)里的圖片拖到頁面中，要插圖片的位置，也可以插入圖片。九、背景音樂（注意：按ESC鍵停止音樂的播放，點(diǎn)刷新重新播放）這一節(jié)我們來學(xué)習(xí)如何設(shè)置背景音樂，放一首音樂在網(wǎng)頁中，往往能給人帶來另外的心情，下面我們來看一個練習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔，把標(biāo)題改為“背景音樂”。3）點(diǎn)“文件－保存”命令，以yinyue為文件名保存文件，保存位置在建立的站點(diǎn)中。4）在右面?zhèn)冗厵诘恼军c(diǎn)中，新建一個文件夾，名稱為music用來存放音樂，找到一首喜歡的歌曲，把它拖到這個文件夾里面。本課images文件夾中有一首1001.mid文件可以作為練習(xí)。2、插入背景音樂1）在標(biāo)簽下面的“文檔”工具欄中點(diǎn)一下“拆分”標(biāo)簽，窗口分成兩部分，上邊是代碼，下邊是文檔。2）在上面的代碼窗口中，找到<body>標(biāo)簽，在它后面點(diǎn)一下鼠標(biāo)，然后按一下回車鍵插入一個空行，3）切換到英文輸入法狀態(tài)，輸入<bgsoundsrc="music/1001.mid"loop="-1"/>輸入的時候會有提示，里面的單詞是代碼標(biāo)簽，雙引號里面是參數(shù)值，-1表示循環(huán)播放。在文件名的標(biāo)簽上敲右鍵選保存命令，保存一下文件，點(diǎn)預(yù)覽按鈕，聽一下背景音樂的播放，停止音樂可以按ESC鍵或點(diǎn)瀏覽器工具欄上的停止按鈕，點(diǎn)刷新重新播放。十、插入音樂這一節(jié)我們來學(xué)習(xí)如何在頁面插入音樂，通過播放器來播放和控制音樂，常見的音樂格式有mp3、wma、rm等等，音樂一般只有聲音，沒有圖像，有圖像的叫視頻，下面我們來看一個練習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔，把標(biāo)題改為“背景音樂”。3）點(diǎn)“文件－保存”命令，以chryy為文件名保存文件，保存位置在建立的站點(diǎn)中。4）在右面?zhèn)冗厵诘恼军c(diǎn)中，找到上次新建的文件夾music，找到一首喜歡的歌曲，把它拖到這個文件夾里面。本課images文件夾中有一首m1文件可以作為練習(xí)，它是wma格式的。2、插入音樂1）在標(biāo)簽下面的“文檔”工具欄中點(diǎn)一下“拆分”標(biāo)簽，窗口分成兩部分，上邊是代碼，下邊是文檔。2）在上面的代碼窗口中，找到<body>標(biāo)簽，在它后面點(diǎn)一下鼠標(biāo)，然后按一下回車鍵插入一個空行，3）切換到英文輸入法狀態(tài)，輸入下列代碼：<embedsrc="music/m1.wma"width="320"height="40"

controls="ControlPanel"loop="false"autostart="false"

type="audio/x-pn-realaudio-plugin"initfn="load-types"></embed>輸入的時候會有提示，里面的單詞是代碼標(biāo)簽，雙引號里面是參數(shù)值，loop是循環(huán)的意思，autostart是自動播放，這兒都是false，也就是不用的意思。保存一下文件，點(diǎn)預(yù)覽按鈕，點(diǎn)左邊的播放按鈕，聽一下悠揚(yáng)的樂曲。停止音樂可以點(diǎn)播放器上的停止按鈕，要播放其他音樂，只要修改src標(biāo)簽后面的音樂地址即可。十一、插入視頻這一節(jié)我們來學(xué)習(xí)如何在頁面插入視頻，常見的視頻格式有wmv、avi、mpg、rmvb等等，視頻文件一般既有聲音又有圖像，因此也叫影片，下面我們來看一個練習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔，把標(biāo)題改為“插入視頻”。3）點(diǎn)“文件－保存”命令，以chrshp為文件名保存文件，保存位置在建立的站點(diǎn)中。4）在右面?zhèn)冗厵诘恼军c(diǎn)中，新建的文件夾video，用來保存視頻文件。本課images文件夾中有一個首zj文件可以作為練習(xí)，它是wmv格式的。2、插入視頻1）在標(biāo)簽下面的“文檔”工具欄中點(diǎn)一下“拆分”標(biāo)簽，窗口分成兩部分，上邊是代碼，下邊是文檔。2）在上面的代碼窗口中，找到<body>標(biāo)簽，在它后面點(diǎn)一下鼠標(biāo)，然后按一下回車鍵插入一個空行，3）切換到英文輸入法狀態(tài)，輸入下列代碼：<objectid="WindowsMediaPlayer1"classid="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6"

width="160"height="190">

<paramname="URL"value="video/zj.wmv">

<paramname="rate"value="1"/>

<paramname="balance"value="0"/>

<paramname="currentPosition"value="0"/>

<paramname="defaultFrame"value/>

<paramname="playCount"value="1"/>

<paramname="autoStart"value="0"/>

<paramname="currentMarker"value="0"/>

<paramname="invokeURLs"value="-1"/>

<paramname="baseURL"value/>

<paramname="volume"value="50"/>

<paramname="mute"value="0"/>

<paramname="uiMode"value="mini"/>

<paramname="stretchToFit"value="-1"/>

<paramname="windowlessVideo"value="0"/>

<paramname="enabled"value="-1"/>

<paramname="enableContextMenu"value="-1"/>

<paramname="fullScreen"value="0"/>

<paramname="SAMIStyle"value/>

<paramname="SAMILang"value/>

<paramname="SAMIFilename"value/>

<paramname="captioningID"value/>

<paramname="enableErrorDialogs"value="0"/>

</object>采用復(fù)制粘貼的方法即可，里面修改的地方主要是藍(lán)色部分，影片地址、寬度和高度，注意播放器有70的高度，因此整個高度是190，影片實際大小為160×120，在影片屬性中可以查看到。保存一下文件，點(diǎn)預(yù)覽按鈕，點(diǎn)左邊的播放按鈕，看一下影片的效果。十二、插入表格這一節(jié)我們來學(xué)習(xí)如何在頁面插入表格，利用表格可以很好地布置頁面，在表格單元中可以放文字、圖片、視頻等等，每個單元都是一個獨(dú)立的區(qū)域，下面我們來看一個練習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔，把標(biāo)題改為“插入表格”。3）點(diǎn)“文件－保存”命令，以chrbg為文件名保存文件，保存位置在建立的站點(diǎn)中。2、插入表格1）點(diǎn)菜單“插入－表格”命令，出來一個對話框，一般修改上面的兩行，表格的行列數(shù)和寬度。2）點(diǎn)“確定”即可插入一個3×3的表格，橫著的是行，豎著的是列，每一個小格叫單元格。

第二列第三列第二行

第三行

3）在表格的邊框上點(diǎn)一下，可以選中整個表格，下面的屬性面板中也出來表格的各個選項，邊框為0的時候不顯示邊框線。上邊綠色的三角里頭有一個命令菜單，可以進(jìn)行相關(guān)的操作。4）在一個單元格里點(diǎn)一下以后，下面的屬性面板顯示單元格的選項，點(diǎn)菜單里的“修改－表格”命令，里頭可以插入一個行、一個列等等。3、練習(xí)：插入一個3×3的表格，在每個格子里輸入一個成語。保存一下文件，點(diǎn)預(yù)覽按鈕，看一下表格的效果。十三、插入Flash這一節(jié)我們來學(xué)習(xí)如何在頁面插入Flash動畫，F(xiàn)lash動畫格式有swf和Flv，下面我們來看一個練習(xí)。1、啟動Dreamweaver1）點(diǎn)擊“開始－所有程序－Macromedia－MacromediaDreamweaver8”，。2）在中間的“創(chuàng)建新項目”中點(diǎn)第一個HTML，打開一個空白文檔，把標(biāo)題改為“插入Flash”。3）點(diǎn)“文件－保存”命令，以chrflsh為文