Web前端開發(fā)實(shí)訓(xùn)案例教程（初級(jí)）

第1章 概述 （1）
1．1 實(shí)踐目標(biāo) （1）
1．2 技術(shù)專題設(shè)計(jì) （1）
1．3 案例設(shè)計(jì) （4）
第2章 開發(fā)環(huán)境：第一個(gè)HTML5程序 （10）
2．1 技能和知識(shí)點(diǎn) （10）
2．2 需求簡(jiǎn)介 （10）
2．3 設(shè)計(jì)思路 （10）
2．4 實(shí)現(xiàn) （11）
2．4．1 下載安裝Chrome （11）
2．4．2 下載安裝HBuilder （13）
2．4．3 創(chuàng)建Web項(xiàng)目并運(yùn)行 （15）
第3章 HTML5表單―注冊(cè)頁(yè)面 （19）
3．1 技能和知識(shí)點(diǎn) （19）
3．2 需求簡(jiǎn)介 （20）
3．3 設(shè)計(jì)思路 （20）
3．4 實(shí)現(xiàn) （21）
3．4．1 創(chuàng)建注冊(cè)頁(yè)面 （21）
3．4．2 搭建頭部和正文結(jié)構(gòu) （22）
3．4．3 編寫頭部 （22）
3．4．4 編寫正文 （23）
第4章 HTML5頁(yè)面增強(qiáng)：資訊網(wǎng)站 （25）
4．1 技能和知識(shí)點(diǎn) （25）
4．2 需求簡(jiǎn)介 （25）
4．3 設(shè)計(jì)思路 （26）
4．4 實(shí)現(xiàn) （27）
4．4．1 創(chuàng)建資訊詳情頁(yè)面 （27）
4．4．2 搭建頭部和正文結(jié)構(gòu) （27）
4．4．3 編寫頭部 （28）
4．4．4 編寫正文 （28）
第5章 HTML5全局屬性：通信錄 （30）
5．1 技能和知識(shí)點(diǎn) （30）
5．2 需求簡(jiǎn)介 （30）
5．3 設(shè)計(jì)思路 （31）
5．4 實(shí)現(xiàn) （32）
5．4．1 創(chuàng)建通信錄頁(yè)面 （32）
5．4．2 搭建頭部和正文結(jié)構(gòu) （32）
5．4．3 編寫頭部 （33）
5．4．4 編寫正文 （33）
第6章 HTML5多媒體：HTML5播放音頻 （37）
6．1 技能和知識(shí)點(diǎn) （37）
6．2 需求簡(jiǎn)介 （37）
6．3 設(shè)計(jì)思路 （38）
6．4 實(shí)現(xiàn) （38）
6．4．1 搭建頁(yè)面結(jié)構(gòu) （38）
6．4．2 設(shè)置標(biāo)題 （39）
6．4．3 創(chuàng)建音樂(lè)列表 （39）
第7章 HTML5多媒體：HTML5播放視頻 （41）
7．1 技能和知識(shí)點(diǎn) （41）
7．2 需求簡(jiǎn)介 （41）
7．3 設(shè)計(jì)思路 （42）
7．4 實(shí)現(xiàn) （42）
7．4．1 搭建頁(yè)面結(jié)構(gòu) （42）
7．4．2 設(shè)置標(biāo)題 （43）
7．4．3 創(chuàng)建視頻列表 （43）
第8章 HTML5語(yǔ)義化元素：音樂(lè)內(nèi)容頁(yè) （45）
8．1 技能和知識(shí)點(diǎn) （45）
8．2 需求簡(jiǎn)介 （45）
8．3 設(shè)計(jì)思路 （46）
8．4 實(shí)現(xiàn) （47）
8．4．1 搭建頁(yè)面結(jié)構(gòu) （47）
8．4．2 制作頁(yè)頭 （47）
8．4．3 創(chuàng)建正文結(jié)構(gòu) （48）
8．4．4 創(chuàng)建音樂(lè)內(nèi)容 （48）
8．4．5 操作按鈕 （49）
8．4．6 制作頁(yè)腳 （49）
第9章 CSS+CSS3：微博網(wǎng)站首頁(yè) （50）
9．1 技能和知識(shí)點(diǎn) （50）
9．2 需求簡(jiǎn)介 （50）
9．3 設(shè)計(jì)思路 （51）
9．4 實(shí)現(xiàn) （52）
9．4．1 搭建頁(yè)面結(jié)構(gòu) （52）
9．4．2 制作頁(yè)頭 （53）
9．4．3 制作正文導(dǎo)航欄 （56）
9．4．4 制作正文微博列表 （58）
第10章 CSS+CSS3：技術(shù)論壇系統(tǒng)首頁(yè) （61）
10．1 技能和知識(shí)點(diǎn) （61）
10．2 需求簡(jiǎn)介 （61）
10．3 設(shè)計(jì)思路 （62）
10．4 實(shí)現(xiàn) （63）
10．4．1 搭建頁(yè)面結(jié)構(gòu) （63）
10．4．2 制作頁(yè)頭 （64）
10．4．3 添加標(biāo)題動(dòng)畫 （65）
10．4．4 制作正文分類列表 （66）
10．4．5 制作正文帖子列表 （67）
第11章 移動(dòng)端：電商列表頁(yè) （70）
11．1 技能和知識(shí)點(diǎn) （70）
11．2 需求簡(jiǎn)介 （70）
11．3 設(shè)計(jì)思路 （71）
11．4 實(shí)現(xiàn) （72）
11．4．1 搭建頁(yè)面結(jié)構(gòu) （72）
11．4．2 設(shè)置視口 （72）
11．4．3 制作頁(yè)頭 （73）
11．4．4 創(chuàng)建商品列表 （74）
第12章 移動(dòng)端：視頻網(wǎng)站 （77）
12．1 技能和知識(shí)點(diǎn) （77）
12．2 需求簡(jiǎn)介 （77）
12．3 設(shè)計(jì)思路 （78）
12．4 實(shí)現(xiàn) （79）
12．4．1 搭建頁(yè)面結(jié)構(gòu) （79）
12．4．2 設(shè)置視口 （79）
12．4．3 創(chuàng)建視頻播放控件 （79）
12．4．4 創(chuàng)建評(píng)論列表 （80）
12．4．5 創(chuàng)建發(fā)布評(píng)論表單 （81）
12．4．6 頁(yè)面優(yōu)化 （83）
第13章 JavaScript基礎(chǔ)語(yǔ)法：日期計(jì)算器 （85）
13．1 技能和知識(shí)點(diǎn) （85）
13．2 需求簡(jiǎn)介 （85）
13．3 設(shè)計(jì)思路 （86）
13．4 實(shí)現(xiàn) （86）
13．4．1 編寫頁(yè)面 （86）
13．4．2 獲取日期值 （87）
13．4．3 創(chuàng)建日期對(duì)象 （88）
13．4．4 計(jì)算并顯示結(jié)果 （88）
第14章 面向?qū)ο螅簩W(xué)生信息管理 （90）
14．1 技能和知識(shí)點(diǎn) （90）
14．2 需求簡(jiǎn)介 （90）
14．3 設(shè)計(jì)思路 （91）
14．4 實(shí)現(xiàn) （91）
14．4．1 創(chuàng)建文件 （91）
14．4．2 創(chuàng)建構(gòu)造函數(shù) （92）
14．4．3 添加原型方法 （92）
14．4．4 實(shí)例化對(duì)象 （92）
第15章 DOM操作：學(xué)生信息列表 （94）
15．1 技能和知識(shí)點(diǎn) （94）
15．2 需求簡(jiǎn)介 （94）
15．3 設(shè)計(jì)思路 （95）
15．4 實(shí)現(xiàn) （96）
15．4．1 編寫頁(yè)面 （96）
15．4．2 生成學(xué)生信息表格 （97）
15．4．3 新增學(xué)生信息 （98）
15．4．4 刪除學(xué)生信息 （100）
第16章 jQuery：目錄頁(yè)面生成 （101）
16．1 技能和知識(shí)點(diǎn) （101）
16．2 需求簡(jiǎn)介 （101）
16．3 設(shè)計(jì)思路 （102）
16．4 實(shí)現(xiàn) （102）
16．4．1 引入jQeury （102）
16．4．2 搭建頁(yè)面 （103）
16．4．3 定義數(shù)組 （104）
16．4．4 顯示目錄內(nèi)容 （104）
16．4．5 單擊目錄顯示內(nèi)容 （105）
第17章 案例：在線視頻課程網(wǎng)站 （107）
17．1 需求和設(shè)計(jì) （107）
17．1．1 項(xiàng)目背景 （107）
17．1．2 項(xiàng)目目標(biāo) （107）
17．1．3 項(xiàng)目功能 （108）
17．1．4 開發(fā)環(huán)境 （109）
17．1．5 程序結(jié)構(gòu)設(shè)計(jì) （109）
17．2 界面設(shè)計(jì) （111）
17．2．1 頁(yè)面類型 （111）
17．2．2 頁(yè)面整體布局 （112）
17．2．3 用戶登錄頁(yè)面設(shè)計(jì) （112）
17．2．4 首頁(yè)設(shè)計(jì) （112）
17．2．5 課程列表頁(yè)面設(shè)計(jì) （113）
17．2．6 移動(dòng)端首頁(yè)設(shè)計(jì) （113）
17．3 第一階段HTML5：首頁(yè) （114）
17．3．1 功能簡(jiǎn)介 （114）
17．3．2 設(shè)計(jì)思路 （114）
17．3．3 實(shí)現(xiàn) （115）
17．4 第一階段HTML5：用戶注冊(cè) （118）
17．4．1 功能簡(jiǎn)介 （118）
17．4．2 設(shè)計(jì)思路 （119）
17．4．3 實(shí)現(xiàn) （119）
17．5 第一階段HTML5：用戶登錄 （122）
17．5．1 功能簡(jiǎn)介 （122）
17．5．2 設(shè)計(jì)思路 （123）
17．5．3 實(shí)現(xiàn) （124）
17．6 第一階段HTML5：課程詳情 （127）
17．6．1 功能簡(jiǎn)介 （127）
17．6．2 設(shè)計(jì)思路 （127）
17．6．3 實(shí)現(xiàn) （128）
17．7 第一階段HTML5：視頻播放 （135）
17．7．1 功能簡(jiǎn)介 （135）
17．7．2 設(shè)計(jì)思路 （135）
17．7．3 實(shí)現(xiàn) （136）
17．8 第一階段HTML5：后臺(tái)課程管理 （141）
17．8．1 功能簡(jiǎn)介 （141）
17．8．2 設(shè)計(jì)思路 （141）
17．8．3 實(shí)現(xiàn) （142）
17．9 第二階段CSS3：首頁(yè) （146）
17．9．1 功能簡(jiǎn)介 （146）
17．9．2 設(shè)計(jì)思路 （147）
17．9．3 實(shí)現(xiàn) （148）
17．10 第二階段CSS3：用戶注冊(cè) （162）
17．10．1 功能簡(jiǎn)介 （162）
17．10．2 設(shè)計(jì)思路 （163）
17．10．3 實(shí)現(xiàn) （163）
17．11 第二階段CSS3：用戶登錄 （168）
17．11．1 功能簡(jiǎn)介 （168）
17．11．2 設(shè)計(jì)思路 （168）
17．11．3 實(shí)現(xiàn) （169）
17．12 第二階段CSS3：課程詳情 （171）
17．12．1 功能簡(jiǎn)介 （171）
17．12．2 設(shè)計(jì)思路 （172）
17．12．3 實(shí)現(xiàn) （173）
17．13 第二階段CSS3：章節(jié)目錄 （178）
17．13．1 功能簡(jiǎn)介 （178）
17．13．2 設(shè)計(jì)思路 （179）
17．13．3 實(shí)現(xiàn) （180）
17．14 第二階段CSS3：視頻播放 （191）
17．14．1 功能簡(jiǎn)介 （191）
17．14．2 設(shè)計(jì)思路 （191）
17．14．3 實(shí)現(xiàn) （192）
17．15 第二階段CSS3：后臺(tái)課程管理首頁(yè) （200）
17．15．1 功能簡(jiǎn)介 （200）
17．15．2 設(shè)計(jì)思路 （201）
17．15．3 實(shí)現(xiàn) （202）
17．16 第三階段JavaScript+jQuery：章節(jié)目錄頁(yè)面交互效果 （213）
17．16．1 功能簡(jiǎn)介 （213）
17．16．2 設(shè)計(jì)思路 （214）
17．16．3 實(shí)現(xiàn) （214）
17．17 第三階段JavaScript+jQuery：視頻播放頁(yè)面交互效果 （215）
17．17．1 功能簡(jiǎn)介 （215）
17．17．2 設(shè)計(jì)思路 （216）
17．17．3 實(shí)現(xiàn) （216）
17．18 第三階段JavaScript+jQuery：后臺(tái)課程管理首頁(yè)交互效果 （218）
17．18．1 功能簡(jiǎn)介 （218）
17．18．2 設(shè)計(jì)思路 （219）
17．18．3 實(shí)現(xiàn) （219）
17．19 第四階段移動(dòng)端：首頁(yè) （222）
17．19．1 功能簡(jiǎn)介 （222）
17．19．2 設(shè)計(jì)思路 （223）
17．19．3 實(shí)現(xiàn) （224）
17．20 第四階段移動(dòng)端：用戶登錄 （233）
17．20．1 功能簡(jiǎn)介 （233）
17．20．2 設(shè)計(jì)思路 （233）
17．20．3 實(shí)現(xiàn) （234）