中等職業學校特色教材DreamweaverCS3宋振宇朱孟邢主編山東科學技術出版社中等職業學校特色教材編審委員會主任李守貴龐運濤副主任張西臣張天水榮學文王玉軍曹竹卿成員左士光尹迎峰楊海濱王緒強王開冬袁瓊孫希強吳清現駱洪山楊宇孟凡利史現素梁繼軍本書編寫人員主編宋振宇朱孟邢副主編雲聖保王洪波參編人員袁瓊梁繼軍王建東劉紅霞解誌軍劉晨龍顏娟王雷鳴朱建平王濟飛尹曉娟前言FOREWORD隨著信息技術的飛速發展，信息化、網絡化徹底改變了傳統的工作方式和生活方式。
網絡和網站已成為現代生活、工作的重要平台。數字化生存不僅需要現代人掌握並使用網絡的基礎能力，更需要以網絡技術、信息技術為依托的開拓能力。
本教材采用“項目引領、任務驅動”型的模式編寫而成，讓學生全麵實踐網頁設計的工作過程。課程內容以項目形式呈現，通過項目將相關課程的內容有機地結合起來。課程內容是按照項目實施的順序劃分為單元，不是按照學科內容的順序劃分為單元。隨著簡單（項目學習）到複雜（項目實訓）、案例到任務、任務到項目逐步地深入，全麵推進課程教學內容，學生受項目任務的驅動，積極參與項目分析、項目設計與項目實施，完整地經曆網頁設計入門學習到應用開發的全過程。課程以學生能夠完成一個相對獨立的網站建設項目為最終目標。
本教材具有以下特色：1.采用“項目任務驅動法”的拓展模式，即“項目+要點提示+任務實施+知識點”的結構進行編寫。
2.充分考慮中職學生的知識水平和特點，理論知識以“夠用”為度，強調趣味性、實用性、針對性和可操作性。以精心設計實例的具體操作吸引學生的學習興趣，著重培養學生的實際操作能力，讓學生在完成具體實踐操作的同時，逐步領會相關知識，從而掌握相關技能和技巧，做到舉一反三，融會貫通。
3.內容翔實，圖文並茂，對每個知識點都給出了針對性的實例及相應的操作任務實施步驟，操作步驟詳細、設計思想新穎。
本教材由臨沭縣職業中等專業學校專業教師編寫，前期教材思路整理由朱孟邢完成，根據學習需要分設八個項目：項目一網頁製作基礎知識及項目二站點的創建與管理由雲聖保完成；項目三常見多媒體元素的編輯及項目四網頁的布局由王洪波完成；項目五簡單網頁特效製作及項目七網站的上傳和發布由宋振宇完成；項目六簡單的動態網站設計及項目八綜合應用由朱孟邢完成，後期教材的整合完善由宋振宇完成，其他專業教師參與了研討和修改。教材在編寫過程中，充分聽取了許多臨沂市專業骨幹教師和行業、企業技術人員的指導意見，在此表示感謝。
由於編者水平有限，疏漏、錯誤之處在所難免，懇請廣大讀者批評指正。
編者2013年6月圖書在版編目（CIP）數據DreamweaverCS3\/宋振宇，朱孟邢主編.—濟南：山東科學技術出版社，2013中等職業學校特色教材ISBN978-7-5331-7007-3Ⅰ.①D…Ⅱ.①宋…②朱…Ⅲ.①網頁製作工具—中等專業學校—教材Ⅳ.①TP393.092中國版本圖書館CIP數據核字（2013）第192667號中等職業學校特色教材DreamweaverCS3主編宋振宇朱孟邢出版者：山東科學技術出版社地址：濟南市玉函路16號郵編：250002電話：(0531)82098088網址：www.lkj.com.cn電子郵件：[email protected]發行者：山東科學技術出版社地址：濟南市玉函路16號郵編：250002電話：(0531)82098071印刷者：臨沭縣書刊印刷廠地址：臨沭縣城南工業區郵編：276700電話：(0539)6280890開本：787mm×1092mm1\/16印張：11.75版次：2013年8月第1版第1次印刷ISBN978-7-5331-7007-3定價：29.50元目錄CONTENTS項目一網頁製作基礎知識···········································································································1任務我的第一個網頁——利用HTML語言製作網頁·····················································1項目二站點的創建與管理·········································································································11任務創建“臨沭縣職業中專”網站站點··········································································11項目三常見多媒體元素的編輯·································································································20任務一文本格式設置·········································································································20任務二圖像的編輯與處理·································································································25任務三Flash的應用···········································································································31任務四插入其他多媒體元素·····························································································34任務五編輯網站鏈接·········································································································35項目四網頁的布局····················································································································41任務一表格的使用技巧·····································································································41任務二使用框架布局網頁·································································································49任務三使用APDiv布局網頁···························································································55任務四趣味拚圖·················································································································59任務五模板的應用·············································································································61項目五簡單網頁特效製作·········································································································67任務一對臨沭職專頁麵進行美化（CSS樣式表的應用）················································67任務二zy的動漫世界——行為在網頁中的效果應用····················································80任務三zy的動漫世界——時間軸動態效果的應用························································871
項目六簡單的動態網站設計·····································································································95任務一注冊頁麵的製作——表單的應用·········································································95任務二成績查詢——表單的應用···················································································106項目七網站的上傳和發布·······································································································123任務在網上安家——網站的上傳和發布·······································································123項目八綜合應用·······················································································································133任務一學校網站首頁的製作···························································································133任務二CSS樣式表文件的創建及應用··········································································143任務三站點模板的構建···································································································148任務四站點模板的應用···································································································152任務五表單在動態頁麵中的應用···················································································1622
項目一網頁製作基礎知識項目一網頁製作基礎知識★項目要點1.了解網頁的定義及組成元素。
2.了解常見的HTML標記的格式、功能和使用。
3.了解使用HTML源代碼製作簡單網頁的方法。
4.了解Dreamweaver的屬性麵板和文檔工具欄的作用。
任務我的第一個網頁——利用HTML語言製作網頁★任務目的使用網頁編輯工具——記事本，製作一個簡單的網頁，網頁標題是“我的主頁”，內容為“歡迎大家光臨，這是我的第一個網頁。”網頁背景為紅色，文本為藍色，網頁效果如圖1-1所示。
圖1-1我的第一個網頁1
DreamweaverCS3★實施步驟（1）打開記事本，輸入以下代碼：我的主頁歡迎大家光臨，這是我的第一個網頁。
（2）保存該文件到D：\\myweb文件夾中，取名為“firstweb.html”，如圖1-2所示（注意，一定要把文件的擴展名改為.htm或html）。
圖1-2“另存為”對話框（3）在IE瀏覽器的地址欄輸入d：\\myweb\\firstweb.html；顯示如圖1-1所示。
（4）在記事本“歡迎大家光臨，這是我的第一個網頁。”後添加下麵代碼：保存為firstweb.html。在IE瀏覽器的地址欄輸入d：\\myweb\\firstweb.html；顯示如圖1-3所示。
圖1-3我的主頁2
項目一網頁製作基礎知識（5）在後輸入以下內容：臨沭職業中專校徽保存為firstweb.html。在IE瀏覽器的地址欄輸入d：\\myweb\\firstweb.html；顯示如圖1-4所示。
圖1-4修改後的我的主頁★知識鏈接1.認識網站與網頁網頁設計是一門綜合性技術，包含許多方麵的內容。網頁是構成網絡的主體，是互聯網信息的主要載體。在學習網頁製作前，需要了解網頁製作的相關知識，以便在以後的學習及工作中運用。
（1）網頁的定義及組成元素：網頁就是我們上網時在瀏覽器中看到的一個個畫麵，網站則是一組相關網頁的集合。一個小型網站可能隻包含幾個網頁，而一個大型網站則可能包含成千上萬個網頁。
小貼士：普通網站一般包括3部分。域名：網站的地址標識，就像房屋的門牌號一樣，作為用戶訪問網站的標識。網絡空間：在永久接入互聯網的計算機中擁有存放網站網頁資料的空間，這個空間作為網站存儲的物理空間。網站內容：就是通過瀏覽器所看到的網頁。
3DreamweaverCS3另外，打開某個網站時顯示的第一個網頁被稱為網站的主頁（或首頁），它可以說是網站的門戶，通過它不僅可以了解網站的性質和內容，還可以通過該頁麵中的導航欄訪問網站中的其他頁麵。網頁中包括多種多樣的網頁元素，如文本、圖像、動畫和音樂等。文本是網頁最基本的組成元素，是網頁的主體部分。圖像也是網頁中不可缺少的元素，是使網頁看起來更美觀的點睛之筆。動畫在網頁中也有廣泛的應用，網頁中常用的動畫格式主要有兩種：一種是SWF動畫，一種是GIF動畫。播放音樂是為瀏覽者提供聽覺感受的最佳選擇，但因為受音樂版權的約束，在專業網站中很少有使用背景音樂的，隻在部分個人主頁或企業網站中有所使用。
（2）網頁常見部分的稱謂及規範：通常情況下，網頁的基本組成部分有站標、導航條、廣告條、超鏈接和版權信息等。
①站標，也叫Logo，是網站的標誌，其作用是使人看見它就能夠聯想到企業。因此，企業網站Logo通常采用企業的Logo。Logo一般采用蘊含企業文化和特色的圖案，或是與企業名稱相關的字符或符號及其變形，當然也有很多是圖文組合。如圖1-5所示。