內容簡介
Dreamweaver CC是一款集網頁制作和管理網站于一身的網頁編輯器,是針對專業網頁設計師特別開發的視覺化網頁開發工具。本書以通俗易懂的語言、翔實生動的操作案例、精挑細選的使用技巧,指導初學者快速掌握Dreamweaver CC中文版的基礎知識與方法。全書共分為16章,主要內容包括網頁設計制作基礎入門、Dreamweaver CC輕松入門、創建與管理本地站點、編輯結構清晰的網頁信息、在網頁中應用圖像與多媒體、超鏈接、使用表格布局頁面、應用CSS樣式美化網頁、應用Div+CSS布局網頁、使用模板和庫創建網頁、創建表單網頁、使用行為創建動態效果、制作jQuery Mobile頁面、編輯HTML代碼與實踐應用、站點的發布與推廣以及設計與制作網站等方面的知識。全書結構清晰、圖文并茂,以實戰演練的方式介紹知識點,讓讀者一看就懂。
本書面向學習該軟件的初、中級用戶,適合無基礎又想快速掌握Dreamweaver CC入門操作經驗的讀者,同時對有經驗的Dreamweaver CC使用者也有很高的參考價值,還可以作為高等院校專業課教材和社會培訓機構的培訓教材。
前 言
Adobe公司的網頁設計軟件Dreamweaver就是當下最流行的Web開發工具之一。為幫助讀者快速掌握與應用Dreamweaver CC軟件,以便在工作中學以致用,我們編寫了《Dreamweaver CC中文版網頁設計與制作(微課版)》。
一、購買本書能學到什么?
本書為讀者快速入門Dreamweaver CC提供了一個嶄新的學習和實踐平臺,無論從基礎知識安排還是應用能力的訓練,都充分地考慮了用戶的需求,可以快速達到理論知識與應用能力的同步提高。本書在編寫過程中根據電腦初學者的學習習慣,采用由淺入深、由易到難的方式講解。全書結構清晰、內容豐富,主要內容包括以下5個方面。
1. 基礎入門
第1~2章介紹關于Dreamweaver CC的一些基礎知識,包括網頁的基本要素、網頁中的色彩特性以及Dreamweaver CC的工作環境等內容。
2. 網頁設計與制作
第3~7章主要講解網頁設計與制作的內容,全面介紹創建管理站點、在網頁中編排文本、使用圖像與多媒體豐富網頁內容、網頁超級鏈接的應用和使用表格布局頁面的方法與技巧。
3. CSS樣式布局頁面
第8~9章主要講解利用樣式布局頁面,介紹認識CSS樣式表、創建CSS樣式、將CSS應用到網頁、應用CSS+Div靈活布局網頁、CSS布局方式和使用AP Div元素布局頁面、使用框架布局頁面等方面的方法與技巧。
4. 動態網頁設計
第10~15章全面講解動態網頁設計方面的知識,包括利用模板和庫創建網頁、使用行為創建動態效果、使用表單、HTML代碼與時間應用、制作jQuery Mobile頁面以及站點的發布和推廣方面的知識。
5. 網頁制作案例
第16章通過制作一個完整的網頁案例來幫助讀者回顧前面所講的知識點,并達到鞏固與提高的目的。
二、如何獲取本書的學習資源?
為幫助讀者高效、快捷地學習本書知識點,我們不但為讀者準備了與本書知識點有關的配套素材文件,而且還設計并制作了精品視頻教學課程,同時還為教師準備了PPT課件資源。
讀者在學習本書過程中,可以使用手機瀏覽器、QQ或者微信的掃一掃功能,掃描本書各節標題左下角的二維碼,在打開的視頻播放頁面中在線觀看視頻課程,也可以下載并保存到手機中離線觀看。免費贈送的圖書配套素材文件和PPT教學課件可登錄清華大學出版社官方網站,打開網頁后,搜索本書專屬服務網頁進行下載。
本書由文杰書院組織編寫,參與本書編寫工作的有李軍、袁帥、文雪、李強、高桂華、藺丹、張艷玲、李統財、安國英、賈亞軍、藺影、李偉、馮臣、宋艷輝等。
我們真切希望讀者在閱讀本書之后,可以開闊視野,增長實踐操作技能,并從中學習和總結操作的經驗和規律,達到靈活運用的水平。鑒于編者水平有限,書中紕漏和考慮不周之處在所難免,熱忱歡迎讀者予以批評、指正,以便我們日后能為您編寫更好的圖書。
編 者
目 錄
第1章 網頁設計制作基礎入門 11.1 什么是網頁 21.1.1 認識網站與網頁 21.1.2 靜態網頁 31.1.3 動態網頁 41.2 制作網頁的常用工具 51.2.1 網頁編輯排版軟件Dreamweaver 51.2.2 圖像制作軟件Photoshop和Fireworks 61.2.3 網頁動畫制作軟件Flash 71.2.4 網頁標記語言HTML 81.2.5 網頁腳本語言JavaScript 81.2.6 動態網頁編程語言ASP 81.3 網頁的基本要素 91.3.1 Logo 91.3.2 Banner 91.3.3 導航欄 101.3.4 文本 101.3.5 圖像 101.3.6 Flash動畫 111.3.7 表單 111.3.8 屏幕分辨率 111.4 網頁的相關知識 121.4.1 因特網 121.4.2 萬維網 131.4.3 瀏覽器 131.4.4 HTML 131.4.5 電子郵件 131.4.6 URL 141.4.7 域名 141.4.8 IP地址 141.5 網頁設計中的色彩應用 151.5.1 網頁色彩的特性 151.5.2 網頁安全色 161.5.3 色彩模式 161.5.4 網頁配色的基本規則 171.5.5 網頁配色中的文本顏色 181.6 怎樣設計出好的網頁 191.6.1 網頁設計的基本原則 191.6.2 網頁設計的成功要素 201.6.3 網頁的色彩搭配 211.7 范例應用與上機操作 221.7.1 網站的制作流程 221.7.2 靜態網頁的制作流程 241.7.3 網頁編輯器 241.8 本章小結與課后練習 25第2章 Dreamweaver CC輕松入門 272.1 認識工作界面 282.1.1 界面布局 282.1.2 菜單欄 282.1.3 【插入】面板 292.1.4 工具窗口和面板 302.1.5 屬性檢查器 312.1.6 使用管理面板和面板組 322.2 設置Dreamweaver視圖 332.2.1 切換“文檔”視圖 332.2.2 使用可視化助理 342.3 范例應用與上機操作 362.3.1 使用輔助線 362.3.2 使用跟蹤圖像 372.3.3 設置縮放比率 382.3.4 調整窗口大小 392.3.5 調整頁面方向 392.3.6 設置工具欄顯示方式 402.4 本章小結與課后練習 412.4.1 思考與練習 412.4.2 上機操作 41第3章 創建與管理本地站點 433.1 站點及站點結構 443.1.1 什么是站點 443.1.2 站點結構 443.2 創建本地站點 453.2.1 使用向導搭建站點 453.2.2 使用高級面板創建站點 463.3 管理站點 463.3.1 認識【管理站點】對話框 473.3.2 打開站點 483.3.3 編輯站點 483.3.4 復制站點 493.3.5 刪除站點 493.3.6 站點的切換 503.4 站點的規劃與操作 513.4.1 站點規劃 513.4.2 在站點中新建文件夾 513.4.3 在站點中新建網頁文件 523.4.4 使用【新建文檔】對話框新建文件 533.4.5 移動和復制文件或文件夾 533.4.6 重命名文件或文件夾 553.4.7 刪除文件或文件夾 563.5 范例應用與上機操作 573.5.1 在站點中新建名為“音樂”的文件夾 573.5.2 在站點中新建名為“視頻網頁”的文件 573.5.3 使用站點地圖 583.5.4 Business Catalyst站點 583.5.5 文件視圖列 593.6 本章小結與課后練習 603.6.1 思考與練習 603.6.2 上機操作 60第4章 編輯結構清晰的網頁信息 614.1 在網頁中插入文本 624.1.1 輸入網頁文本 624.1.2 設置文本屬性 634.1.3 允許輸入連續的空格 634.1.4 設置是否顯示不可見元素 644.1.5 設置頁邊距 644.2 插入特殊文本對象 654.2.1 插入特殊字符 664.2.2 插入水平線 664.2.3 插入日期和時間 674.3 項目列表和編號列表 674.3.1 設置項目列表或編號列表 684.3.2 修改項目列表或編號列表 684.3.3 設置文本縮進格式 694.4 設置頁面的META信息 704.4.1 設置網頁的文字編碼格式 704.4.2 設置網頁的到期時間 704.4.3 禁止瀏覽器從本地計算機的緩存中讀取頁面內容 704.5 設置網頁的頭信息 714.5.1 設置網頁標題 714.5.2 添加關鍵字 724.5.3 添加說明 724.6 設置頁面屬性 734.6.1 設置外觀(CSS) 734.6.2 設置外觀(HTML) 744.6.3 設置鏈接(CSS) 744.6.4 設置標題(CSS) 754.6.5 設置標題和編碼 754.6.6 設置跟蹤圖像 764.7 范例應用與上機操作 764.7.1 設置cookie過期 774.7.2 強制網頁在當前窗口中以獨立頁面顯示 774.7.3 設置網頁打開時的效果 784.7.4 設置網頁退出時的效果 784.7.5 插入短破折線 794.8 本章小結與課后練習 794.8.1 思考與練習 804.8.2 上機操作 80第5章 在網頁中應用圖像與多媒體 815.1 常用的圖像格式 825.1.1 JPEG格式圖像 825.1.2 GIF格式圖像 825.1.3 PNG格式圖像 825.2 插入與設置圖像 835.2.1 在網頁中插入圖像文件 835.2.2 設置網頁背景圖 845.2.3 圖像的對齊方式 845.2.4 插入Photoshop智能對象 855.2.5 更改圖像的基本屬性 865.3 多媒體在網頁中的應用 875.3.1 插入并設置Flash動畫 885.3.2 插入Flash Video 895.3.3 插入普通音頻 915.4 插入其他圖像 925.4.1 插入鼠標經過圖像 925.4.2 插入Fireworks HTML 935.5 編輯圖像 945.5.1 裁剪圖像 945.5.2 更改圖像大小 955.5.3 調整亮度和對比度 955.5.4 銳化圖像 965.6 使用熱區 975.6.1 繪制熱區 975.6.2 在【屬性】面板中設置熱區 985.7 范例應用與上機操作 985.7.1 插入HTML5 Video 985.7.2 插入HTML5 Audio 995.7.3 插入Edge Animate 1005.7.4 重新取樣 1015.7.5 復制Photoshop選區圖像 1025.8 本章小結與課后練習 1035.8.1 思考與練習 1045.8.2 上機操作 104第6章 超鏈接 1056.1 超鏈接基本概念 1066.1.1 超鏈接的定義 1066.1.2 內部、外部與腳本鏈接 1066.1.3 超鏈接的類型 1076.2 鏈接路徑 1096.2.1 絕對路徑 1096.2.2 文檔相對路徑 1106.2.3 站點根目錄相對路徑 1116.3 創建超鏈接的方法 1126.3.1 使用指向文件圖標創建鏈接 1126.3.2 使用【屬性】面板創建鏈接 1126.4 創建不同種類的超鏈接 1136.4.1 文本超鏈接 1136.4.2 空鏈接 1146.4.3 電子郵件鏈接 1156.5 管理與設置超鏈接 1166.5.1 自動更新鏈接 1166.5.2 在站點范圍內更改鏈接 1176.5.3 檢查站點中的鏈接錯誤 1186.6 超鏈接的屬性控制 1196.6.1 a:link 1196.6.2 a:active 1196.6.3 a:hover 1196.6.4 a:visited 1196.7 范例應用與上機操作 1206.7.1 創建腳本鏈接 1206.7.2 創建下載文件鏈接 1216.7.3 創建錨記鏈接 1226.7.4 創建音視頻鏈接 1226.7.5 使用Hyperlink對話框 1236.8 本章小結與課后練習 1246.8.1 思考與練習 1246.8.2 上機操作 125第7章 使用表格布局頁面 1277.1 表格的創建與應用 1287.1.1 表格的定義與用途 1287.1.2 創建表格 1297.1.3 在表格中輸入內容 1307.1.4 在單元格中插入圖像 1307.1.5 創建嵌套表格 1317.2 設置表格及單元格的屬性 1327.2.1 設置表格屬性 1327.2.2 設置單元格屬性 1337.3 調整表格結構 1347.3.1 選擇單元格和表格 1347.3.2 調整單元格和表格的大小 1357.3.3 插入與刪除表格的行和列 1377.4 處理表格數據 1397.4.1 導入Excel文檔 1397.4.2 排序表格 1407.5 數據表格樣式 1417.5.1 表格模型 1427.5.2 表格標題 1437.5.3 表格樣式控制 1437.6 范例應用與上機操作 1447.6.1 拆分單元格 1447.6.2 合并單元格 1457.6.3 復制、剪切和粘貼表格 1467.6.4 導入表格式數據 1487.6.5 導入Word文檔 1497.7 本章小結與課后練習 1497.7.1 思考與練習 1507.7.2 上機操作 150第8章 應用CSS樣式美化網頁 1518.1 什么是CSS樣式表 1528.1.1 認識CSS 1528.1.2 CSS樣式的類型 1528.1.3 CSS樣式基本語法 1538.2 使用【CSS設計器】面板 1548.2.1 認識【CSS設計器】面板 1548.2.2 創建與附加CSS樣式表 1568.2.3 設定媒體查詢 1588.2.4 定義選擇器 1598.2.5 設置CSS規則屬性 1618.3 CSS選擇器的類型 1618.3.1 通配符選擇器 1628.3.2 標簽選擇器 1628.3.3 類選擇器 1628.3.4 ID選擇器 1648.3.5 偽類及偽對象選擇器 1648.3.6 群選擇器 1658.3.7 派生選擇器 1658.4 創建CSS樣式 1668.4.1 創建標簽CSS樣式 1668.4.2 創建類CSS樣式 1678.4.3 創建ID CSS樣式 1688.4.4 創建復合CSS樣式 1708.5 編輯CSS樣式 1718.5.1 設定類型屬性 1718.5.2 設定背景屬性 1728.5.3 設定方框屬性 1738.5.4 設定區塊屬性 1748.5.5 設定邊框屬性 1748.5.6 設定列表屬性 1758.5.7 設定定位屬性 1768.5.8 設定擴展屬性 1768.5.9 設定過渡屬性 1778.6 在Dreamweaver中使用CSS樣式 1788.6.1 內聯CSS樣式 1788.6.2 內部CSS樣式 1788.6.3 鏈接外部CSS樣式表文件 1798.6.4 導入外部CSS樣式表文件 1798.7 應用CSS3過渡效果 1798.7.1 創建CSS3過渡效果 1798.7.2 編輯CSS3過渡效果 1818.7.3 刪除CSS3過渡效果 1818.8 范例應用與上機操作 1838.8.1 應用CSS設置固定字體、字號以及字體顏色 1838.8.2 給網頁添加邊框效果 1838.8.3 為網頁添加CSS類選區 1848.8.4 設置內邊距屬性 1858.8.5 給文本添加列表項目符號 1868.8.6 給網頁添加背景 1878.9 本章小結與課后練習 1888.9.1 思考與練習 1888.9.2 上機操作 188第9章 應用Div+CSS布局網頁 1899.1 Div概述 1909.1.1 什么是Div 1909.1.2 Div CSS布局的優勢 1909.1.3 Div標記和Span標記的區別 1919.2 應用Div布局網頁 1919.2.1 頁面布局分析 1919.2.2 插入和編輯Div標簽 1929.2.3 Div的嵌套和固定格式 1939.3 可視化盒模型 1949.3.1 盒模型的概念 1949.3.2 CSS盒模型的要點 1959.3.3 margin屬性 1969.3.4 border屬性 1979.3.5 padding屬性 1989.3.6 空白邊的疊加 2009.4 CSS的布局定位 2009.4.1 浮動定位 2019.4.2 通過position屬性定位 2019.4.3 相對定位 2039.4.4 絕對定位 2049.4.5 固定定位 2059.5 范例應用與上機操作 2059.5.1 一列固定寬度布局 2059.5.2 一列自適應布局 2069.5.3 兩列固定寬度布局 2079.5.4 兩列寬度自適應布局 2089.5.5 兩列右列寬度自適應布局 2099.5.6 三列浮動中間列寬度自適應布局 2099.6 本章小結與課后練習 2119.6.1 思考與練習 2119.6.2 上機操作 212第10章 使用模板和庫創建網頁 21310.1 使用模板 21410.1.1 模板的特點 21410.1.2 創建模板 21410.1.3 嵌套模板 21510.2 設置模板 21610.2.1 定義可編輯區域 21610.2.2 定義可選區域 21710.2.3 定義重復區域 21710.2.4 定義可編輯的可選區域 21810.2.5 定義重復表格 21910.2.6 設置可編輯標簽屬性 22010.3 應用模板 22110.3.1 創建基于模板的網頁 22110.3.2 更新模板和基于模板的網頁 22210.3.3 從模板中脫離 22310.4 創建與應用庫項目 22310.4.1 認識庫項目 22410.4.2 創建庫項目 22410.4.3 插入庫項目 22510.5 范例應用與上機操作 22610.5.1 修改庫項目 22610.5.2 更新庫項目 22610.5.3 重命名庫項目 22710.5.4 刪除庫項目 22810.5.5 恢復庫項目 22810.6 本章小結與課后練習 22810.6.1 思考與練習 22910.6.2 上機操作 229第11章 創建表單網頁 23111.1 表單概述 23211.1.1 關于表單 23211.1.2 常用表單元素 23211.1.3 HTML5表單元素 23411.2 添加表單 23611.2.1 插入表單域 23611.2.2 插入文本域 23711.3 網頁元素 23911.3.1 表單密碼 23911.3.2 Url對象 23911.3.3 Tel對象 24011.3.4 搜索對象 24011.3.5 數字對象 24111.3.6 范圍對象 24111.3.7 顏色對象 24211.4 日期與時間元素 24311.4.1 月對象 24311.4.2 周對象 24311.4.3 日期對象 24411.4.4 時間對象 24411.4.5 日期時間對象 24511.5 選擇元素 24611.5.1 選擇對象 24611.5.2 單選按鈕 24711.5.3 單選按鈕組 24811.5.4 復選框 24911.6 按鈕元素 25011.6.1 普通按鈕 25011.6.2 【提交】按鈕 25111.6.3 【重置】按鈕 25211.7 范例應用與上機操作 25311.7.1 插入電子郵件對象 25311.7.2 插入本地日期時間對象 25411.7.3 復選框組 25411.7.4 圖像按鈕 25511.7.5 隱藏域 25711.8 本章小結與課后練習 25811.8.1 思考與練習 25811.8.2 上機操作 258第12章 使用行為創建動態效果 25912.1 認識網頁行為 26012.1.1 事件與動作 26012.1.2 使用【行為】面板 26012.1.3 常見動作類型 26112.1.4 常見事件 26212.1.5 編輯與應用網頁行為 26312.2 使用行為調節瀏覽器 26312.2.1 打開瀏覽器窗口 26412.2.2 調用JavaScript 26512.2.3 轉到URL 26612.3 使用行為控制圖像 26712.3.1 交換圖像 26712.3.2 預先載入圖像 26812.3.3 恢復交換圖像 26912.4 使用行為顯示文本 26912.4.1 彈出信息 26912.4.2 設置狀態欄文本 27012.4.3 設置容器的文本 27112.5 使用行為加載多媒體 27212.5.1 檢查插件 27212.5.2 改變屬性 27412.6 控制表單 27512.6.1 跳轉菜單 27512.6.2 跳轉菜單開始 27712.6.3 檢查表單 27712.7 使用JavaScript 27812.7.1 利用JavaScript實現打印功能 27912.7.2 利用JavaScript函數跳轉到某個頁面 27912.7.3 利用JavaScript創建自動滾屏網頁效果 28012.7.4 利用JavaScript函數實現動態時間 28112.7.5 利用JavaScript函數實現動態側邊欄 28212.8 范例應用與上機操作 28412.8.1 設置文本域文字 28412.8.2 設置框架文本 28512.8.3 顯示和隱藏元素 28512.8.4 拖動AP元素 28712.8.5 利用JavaScript函數實現隨意更改背景顏色 28812.9 本章小結與課后練習 29012.9.1 思考與練習 29012.9.2 上機操作 290第13章 制作jQuery Mobile頁面 29113.1 了解jQuery Mobile 29213.1.1 什么是jQuery 29213.1.2 認識jQuery Mobile 29213.2 創建jQuery Mobile頁面 29313.2.1 使用jQuery Mobile起始頁 29313.2.2 使用HTML5頁面 29413.2.3 jQuery Mobile頁面結構 29413.3 使用jQuery Mobile組件 29513.3.1 使用列表視圖 29513.3.2 使用布局網格 29613.3.3 使用可折疊區塊 29713.3.4 使用文本輸入框 29813.3.5 使用密碼輸入框 29813.3.6 使用文本區域 29913.3.7 使用選擇菜單 30013.4 列表與主題 30013.4.1 創建有序列表 30113.4.2 創建內嵌列表 30113.4.3 使用jQuery Mobile主題 30113.5 范例應用與上機操作 30313.5.1 使用復選框 30313.5.2 使用單選按鈕 30413.5.3 使用按鈕 30413.5.4 使用滑塊 30513.5.5 設置翻轉切換開關 30613.6 本章小結與課后練習 30713.6.1 思考與練習 30713.6.2 上機操作 307第14章 編輯HTML代碼與實踐應用 30914.1 HTML概述 31014.1.1 什么是HTML 31014.1.2 HTML的語法結構 31014.1.3 HTML中的3種標簽形式 31114.2 HTML中的標簽 31214.2.1 文件結構標簽 31214.2.2 字符格式標簽 31314.2.3 區段格式標簽 31314.2.4 列表標簽 31414.2.5 表格標簽 31514.2.6 超鏈接標簽 31514.3 在Dreamweaver中編輯HTML 31614.3.1 在代碼視圖中創建HTML頁面 31614.3.2 代碼視圖 31714.3.3 折疊代碼 31814.3.4 選擇父標簽 31814.4 使用快速標簽編輯器 31914.4.1 使用插入模式的快速標簽編輯器 31914.4.2 使用編輯模式的快速標簽編輯器 32014.4.3 使用環繞模式的快速標簽編輯器 32014.5 使用代碼片段 32014.5.1 插入代碼片段 32114.5.2 創建代碼片段 32114.6 優化代碼 32214.6.1 優化HTML代碼 32214.6.2 清理Word生成的HTML代碼 32314.7 網頁中的其他源代碼 32514.7.1 CSS樣式代碼 32514.7.2 JavaScript腳本代碼 32514.7.3 源代碼中的注釋 32614.8 范例應用與上機操作 32614.8.1 多媒體標簽 32614.8.2 表單標簽 32714.8.3 代碼的注釋 32714.8.4 分區標簽 32814.8.5 環繞標簽 32814.9 本章小結與課后練習 32814.9.1 思考與練習 32914.9.2 上機操作 330第15章 站點的發布與推廣 33115.1 測試與維護站點 33215.1.1 創建站點報告 33215.1.2 使用鏈接檢查器 33315.2 上傳發布網站 33415.2.1 設置FTP服務器 33415.2.2 連接到遠程服務器 33515.2.3 文件上傳 33515.3 網站的運營與維護 33615.3.1 網站的運營 33615.3.2 網站的更新維護 33715.4 推廣網站 33815.4.1 注冊搜索引擎 33815.4.2 資源合作推廣方法 33815.4.3 電子郵件推廣 33915.4.4 導航網站登錄 34015.4.5 軟文推廣 34015.4.6 BBS論壇網站推廣 34015.4.7 博客推廣 34015.4.8 微博推廣 34115.4.9 口碑營銷 34115.4.10 微信營銷 34215.5 范例應用與上機操作 34315.5.1 W3C驗證 34315.5.2 文件下載 34415.5.3 優化網站SEO 34415.6 本章小結與課后練習 34515.6.1 思考與練習 34515.6.2 上機操作 345第16章 設計與制作網站 34716.1 確定網頁主題 34816.1.1 選擇網站的主題 34816.1.2 創建網頁 34816.1.3 創建CSS鏈接 34816.1.4 設置CSS樣式 34916.2 添加網頁內容 35016.2.1 插入Div 35016.2.2 插入圖片 35016.2.3 插入Flash 35116.2.4 插入表單 35216.2.5 插入類樣式 35316.2.6 添加列表標簽代碼 35416.2.7 插入媒體插件 35616.3 上傳與瀏覽網頁 35716.3.1 連接遠程服務器 35716.3.2 瀏覽網頁 357參考答案 359