《網(wǎng)頁設(shè)計與制作案例教程/高職高專計算機網(wǎng)絡(luò)系列創(chuàng)新教材》是網(wǎng)頁設(shè)計的基礎(chǔ)性教材,首先介紹使用Dreamweaver CS6創(chuàng)建網(wǎng)站和靜態(tài)網(wǎng)頁的基礎(chǔ)知識和設(shè)計技巧,結(jié)合CSS、HTML和HTML5技術(shù)進(jìn)行講解,由淺入深,使讀者全面理解和掌握網(wǎng)頁設(shè)計與制作技術(shù);其次介紹使用Photoshop CS6修改網(wǎng)頁圖片、制作導(dǎo)航等網(wǎng)頁圖片素材,并通過實例介紹網(wǎng)頁版面效果圖制作和切圖技術(shù);然后介紹使用Flash CS6制作動畫文字和按鈕;最后綜合介紹使用CSS+Div布局網(wǎng)站框架,完成一個綜合網(wǎng)站實例的制作過程。
《網(wǎng)頁設(shè)計與制作案例教程/高職高專計算機網(wǎng)絡(luò)系列創(chuàng)新教材》以案例講解為主線,每一個案例知識點融合在精美的網(wǎng)頁中,作為案例的網(wǎng)頁具有較強的應(yīng)用性和示范作用。《網(wǎng)頁設(shè)計與制作案例教程/高職高專計算機網(wǎng)絡(luò)系列創(chuàng)新教材》配有與案例操作相關(guān)的高清微課視頻,還提供所有素材圖片、案例源代碼、上機實訓(xùn)源代碼、教學(xué)課件和其他拓展學(xué)習(xí)資源等課程資源。《網(wǎng)頁設(shè)計與制作案例教程/高職高專計算機網(wǎng)絡(luò)系列創(chuàng)新教材》適合作為高職高專院校、應(yīng)用型本科院校網(wǎng)頁設(shè)計課程的教材,也可作為網(wǎng)頁設(shè)計和制作自學(xué)人員的參考用書。
第1章 網(wǎng)頁設(shè)計基礎(chǔ)
1.1 網(wǎng)頁的基本概念
1.2 網(wǎng)頁的基本元素
1.3 常用網(wǎng)頁編輯工具
1.4 Dreamweaver CS6的工作環(huán)境
1.5 站點的建立與管理
1.5.1 站點的創(chuàng)建與管理
1.5.2 站點文件的管理
1.5.3 站點的更新與上傳
1.6 網(wǎng)頁文檔的基本操作
1.6.1 創(chuàng)建空白文檔網(wǎng)頁
1.6.2 設(shè)置頁面屬性
1.6.3 創(chuàng)建與管理內(nèi)部類樣式
1.6.4 創(chuàng)建并編輯頁面實例
上機實訓(xùn)
第2章 HTML+CSS簡單頁面制作
2.1 CSS概述
2.1.1 CSS盒子模型
2.1.2 CSS樣式分類
2.1.3 命名規(guī)范
2.2 CSS+Div制作一列布局網(wǎng)頁
2.2.1 CSS+Div制作一列固定寬度布局網(wǎng)頁實例
2.2.2 CSS+Div制作一列自適應(yīng)寬度布局網(wǎng)頁實例
2.3 制作帶背景圖的文字網(wǎng)頁
2.3.1 添加文本內(nèi)容
2.3.2 設(shè)置文本和段落格式
2.3.3 制作可多屏幕瀏覽的文字網(wǎng)頁實例
2.4 制作圖文混排的網(wǎng)頁
2.4.1 圖像的插入與編輯
2.4.2 插入鼠標(biāo)經(jīng)過圖像
2.4.3 圖文混排網(wǎng)頁制作實例
2.5 創(chuàng)建超鏈接
2.5.1 文本鏈接
2.5.2 錨點鏈接
2.5.3 郵件鏈接
2.5.4 下載鏈接
2.5.5 空鏈接
2.5.6 橫向?qū)Ш郊版溄討?yīng)用實例
2.6 插入多媒體對象
2.6.1 插入多媒體對象實例
2.6.2 創(chuàng)建背景音樂實例
上機實訓(xùn)
第3章 CSS樣式應(yīng)用及Spry框架
3.1 CSS外部樣式及優(yōu)先級別
3.1.1 外部樣式的創(chuàng)建和引用
3.1.2 樣式規(guī)則的優(yōu)先級別
3.1.3 用!important提高樣式優(yōu)先級別
3.1.4 樣式規(guī)則的優(yōu)先級別應(yīng)用實例
3.2 使用CSS+Div布局復(fù)雜頁面
3.2.1 使用模板新建頁面實例
3.2.2 使用CSS+Div布局兩列頁面實例
3.2.3 使用CSS+Div布局多列頁面實例
3.3 制作導(dǎo)航
3.3.1 一級列表導(dǎo)航制作實例
3.3.2 橫向豎向列表導(dǎo)航應(yīng)用實例
3.4 S1pry框架布局
3.4.1 Spry多級橫向?qū)Ш街谱鲗嵗?br>3.4.2 Spry多級豎向?qū)Ш街谱鲗嵗?br>3.4.3 Spry選項卡式面板制作實例
3.4.4 Spry折疊式面板制作實例
3.4.5 Spry可折疊面板制作實例
3.4.6 Spry框架應(yīng)用實例
上機實訓(xùn)
第4章 表格與流體網(wǎng)格布局
4.1 創(chuàng)建表格
4.2 表格的基本操作
4.2.1 選擇表格
4.2.2 設(shè)置行數(shù)和列數(shù)
4.2.3 設(shè)置表格大小
4.2.4 設(shè)置表格邊框
4.2.5 設(shè)置表格背景
4.2.6 設(shè)置單元格屬性及表格的嵌套
4.2.7 表格數(shù)據(jù)的導(dǎo)入/導(dǎo)出
4.2.8 表格的排序
4.2.9 表格應(yīng)用實例
4.3 流體網(wǎng)格布局
4.3.1 創(chuàng)建流體網(wǎng)格布局網(wǎng)頁實例
4.3.2 編輯流體網(wǎng)格文檔實例
上機實訓(xùn)
第5章 表單與行為
5.1 認(rèn)識表單
5.2 表單對象
5.2.1 普通表單對象
5.2.2 Spry驗證
5.3 表單應(yīng)用案例
5.4 行為
5.4.1 行為概述
5.4.2 行為的基本操作
5.5 行為應(yīng)用實例
5.5.1 彈出信息
5.5.2 交換圖像
5.5.3 拖動AP元素
5.5.4 顯示-隱藏元素
5.5.5 轉(zhuǎn)到URL
5.5.6 設(shè)置狀態(tài)欄文本
5.5.7 效果行為
上機實訓(xùn)
第6章 模塊和庫
6.1 模板
6.1.1 模板的概念
6.1.2 創(chuàng)建模板
6.1.3 插入模板對象
6.1.4 用模板創(chuàng)建網(wǎng)頁
6.2 庫
6.2.1 創(chuàng)建庫項目
6.2.2 編輯庫項目
6.2.3 使用庫項目
6.2.4 庫項目創(chuàng)建與應(yīng)用實例
上機實訓(xùn)
第7章 HTML與HTML5基礎(chǔ)
7.1 常用的網(wǎng)頁前端編輯工具
7.2 HTML概述
7.2.1 HTML語言
7.2.2 HTML基本文檔結(jié)構(gòu)
7.2.3 HTML基本文檔實例
7.3 HTML頁面基本元素
7.3.1 文本段落、水平線與注釋標(biāo)簽
7.3.2 HTML塊元素與內(nèi)聯(lián)元素
7.3.3 HTML列表
7.3.4 HTML圖像
7.3.5 HTML超鏈接
7.4 HTML5與媒體素材
7.4.1 HTML5概述
7.4.2 HTML5視頻播放實例
7.4.3 HTML5音頻播放實例
7.4.4 基于HTML5的兩列布局頁面實例
7.4.5 基于HTML5的三列布局頁面實例
上機實訓(xùn)
第8章 Photoshop網(wǎng)頁界面設(shè)計
8.1 網(wǎng)頁界面設(shè)計基礎(chǔ)
8.1.1 網(wǎng)頁界面設(shè)計配色
8.1.2 網(wǎng)頁文字圖片元素
8.1.3 網(wǎng)頁中常用的圖片格式
8.2 Photoshop CS6簡介
8.2.1 Photoshop CS6操作界面簡介
8.2.2 工具欄
8.2.3 圖層簡介
8.3 網(wǎng)頁圖形元素的制作實例
8.3.1 線條繪制
8.3.2 按鈕制作
8.3.3 文字陰影
8.3.4 導(dǎo)航條制作
8.3.5 網(wǎng)頁圖像合成與修飾
8.4 網(wǎng)頁版面制作案例
上機實訓(xùn)
第9章 FlaSh動畫素材制作
9.1 認(rèn)識Flash CS6
9.1.1 啟動Flash CS6
9.1.2 Flash CS6操作界面
9.1.3 Flash工具箱
9.1.4 層、幀和Actionscript 3.0腳本
9.2 Flash在網(wǎng)站設(shè)計中的應(yīng)用
9.2.1 Flash文本動畫制作實例
9.2.2 Flash按鈕制作實例
上機實訓(xùn)
第10章 網(wǎng)站設(shè)計制作實例
10.1 網(wǎng)站制作流程
10.2 使用CSS+Div設(shè)計制作靜態(tài)網(wǎng)站
10.2.1 網(wǎng)站的用途及定位
10.2.2 網(wǎng)站內(nèi)容的選取
10.2.3 使用Photoshop切圖
10.2.4 主頁框架制作
10.2.5 導(dǎo)航制作
10.2.6 主頁內(nèi)容區(qū)內(nèi)容制作
10.2.7 建立庫對象
10.2.8 制作前端內(nèi)容頁1
10.2.9 制作前端內(nèi)容頁2
10.2.10 制作前端內(nèi)容頁3
10.2.11 制作前端內(nèi)容頁4
10.3 測試網(wǎng)站
10.3.1 瀏覽器兼容性檢測
10.3.2 鏈接檢測
10.4 發(fā)布網(wǎng)站
10.4.1 使用Dreamweaver CS6自帶工具上傳站點
10.4.2 使用FlashFXP上傳文件
上機實訓(xùn)
附錄拓展教學(xué)資源
參考文獻(xiàn)