HTML5+CSS3+JavaScript項目開發(fā)

目錄
咖啡商城項目導引1
學習目標1
內(nèi)容安排2
項目背景2
項目構(gòu)思3第1章開發(fā)工具HBuilder5
1.1飛速編碼的極客工具6
1.2安裝HBuilder6
1.3認識界面8
1.4新建項目9
1.5Web項目的運行11
1.6移動App的運行12第2章HTML基礎15
2.1認識HTML16
2.1.1HTML基本語法16
2.1.2HTML文檔的基本結(jié)構(gòu)17
2.1.3項目： 第一個HTML頁面18
2.2HTML常用標簽19
2.2.1文本與標簽19
2.2.2項目： 介紹我的學校123
2.3表格元素24
2.3.1表格標簽25
2.3.2項目： 圖書統(tǒng)計表26
2.4表單元素27
2.4.1常用表單元素27
2.4.2項目： 個人信息統(tǒng)計表31
2.5咖啡商城——商品分類模塊33
2.5.1項目說明34
2.5.2項目設計34
2.5.3項目實施34
習題36第3章HTML5新增元素和屬性37
3.1新增文檔結(jié)構(gòu)元素38
3.1.1認識HTML538
3.1.2HTML5頁面結(jié)構(gòu)39
3.1.3HTML5主體結(jié)構(gòu)元素39
3.1.4HTML5非主體結(jié)構(gòu)元素42
3.1.5項目： 新聞評論網(wǎng)43
3.2新增表單元素45
3.2.1HTML5表單新功能45
3.2.2HTML5表單新的輸入類型46
3.2.3HTML5表單新的屬性47
3.2.4項目： 訂貨人個人信息頁49
3.3咖啡商城——用戶注冊模塊實現(xiàn)51
3.3.1項目說明51
3.3.2項目設計52
3.3.3項目實施52
習題54第4章CSS基礎56
4.1CSS基本語法57
4.1.1CSS語句格式57
4.1.2CSS選擇符58
4.1.3項目： 世界杯勝負榜64
4.2文本和字體相關屬性66
4.2.1字體屬性66
4.2.2文本屬性69
4.2.3項目： 介紹我的學校270
4.3背景和邊框相關屬性72
4.3.1邊框72
4.3.2邊框陰影75
4.3.3圓角邊框76
4.3.4圖形邊框76
4.3.5背景77
4.3.6項目： 校訓Logo80
4.4咖啡商城——網(wǎng)站頁腳模塊實現(xiàn)82
4.4.1項目說明82
4.4.2項目設計82
4.4.3項目實施82
習題84第5章CSS盒子模型87
5.1盒子相關屬性88
5.1.1內(nèi)邊距和外邊距88
5.1.2塊級元素與行內(nèi)元素90
5.1.3項目： 盒子模型92
5.2浮動定位93
5.2.1float屬性93
5.2.2clear屬性95
5.2.3項目： 3個相框95
5.3位置定位97
5.3.1position屬性97
5.3.2項目： 照片墻99
5.4隱藏與顯示101
5.4.1visibility屬性101
5.4.2zindex屬性102
5.4.3display屬性103
5.4.4項目： 懸浮菜單103
5.5咖啡商城——商品分類模塊美化效果實現(xiàn)105
5.5.1項目說明105
5.5.2項目設計106
5.5.3項目實施106
習題109第6章CSS3動畫113
6.1Animation動畫114
6.1.1定義關鍵幀114
6.1.2綁定動畫115
6.1.3項目： 跑動的汽車116
6.2Transition動畫118
6.2.1Transition過渡118
6.2.2項目： 頁面切換效果119
6.3咖啡商城——商品介紹模塊實現(xiàn)122
6.3.1項目說明122
6.3.2項目設計123
6.3.3項目實施123
習題125第7章JavaScript基礎126
7.1JavaScript簡介127
7.2在HTML頁面中嵌入JavaScript的方法128
7.3JavaScript的語法規(guī)則129
7.3.1語法129
7.3.2標識符130
7.3.3注釋131
7.3.4項目： 第一個JavaScript程序131
7.4數(shù)據(jù)類型133
7.4.1常用數(shù)據(jù)類型133
7.4.2typeof運算符133
7.4.3Undefined類型134
7.4.4Null類型134
7.4.5Object類型135
7.5變量136
7.6運算符137
7.7流程控制語句138
7.8JavaScript函數(shù)140
7.8.1JavaScript函數(shù)定義140
7.8.2項目： 單擊我142
7.9事件和事件處理144
7.9.1JavaScript常用事件144
7.9.2項目： 敏感的兔子145
習題148第8章JavaScript對象151
8.1內(nèi)置對象152
8.1.1認識JavaScript內(nèi)置對象152
8.1.2Math對象153
8.1.3Date對象154
8.1.4String對象156
8.1.5Number對象158
8.1.6Array對象160
8.1.7項目： 數(shù)字電子時鐘162
8.2BOM對象164
8.2.1認識BOM對象164
8.2.2window對象166
8.2.3history對象168
8.2.4location對象169
8.2.5screen對象169
8.2.6document對象170
8.2.7項目： 打開新窗口170
習題172第9章DOM文檔對象模型175
9.1認識DOM對象176
9.2HTML DOM Document對象176
9.3HTML DOM Event對象181
9.4HTML DOM Element對象183
9.5HTML DOM attribute對象184
9.6DOM與事件185
9.6.1事件綁定的方式185
9.6.2事件處理函數(shù)的執(zhí)行順序187
9.6.3事件冒泡和事件捕獲187
9.7項目： 詩詞鑒賞189
9.8咖啡商城——購物車模塊實現(xiàn)192
9.8.1項目說明192
9.8.2項目設計193
9.8.3項目實施194
習題195第10章Canvas畫布200
10.1繪制基本圖形201
10.1.1認識Canvas201
10.1.2Canvas的常用屬性和方法201
10.1.3使用Canvas繪圖對象繪制基本圖形202
10.1.4項目： 來自星星的它209
10.2繪制圖像213
10.2.1使用Canvas繪圖對象裁剪圖像213
10.2.2項目： 放大鏡216
10.2.3項目： 跳動的心218
10.2.4項目： 鼠標畫板220
10.3咖啡商城——商品詳情模塊實現(xiàn)223
10.3.1項目說明223
10.3.2項目設計223
10.3.3項目實施224
習題226第11章本地存儲229
11.1Web Storage230
11.1.1Web Storage的常用屬性和方法230
11.1.2項目： 簡易購物車231
11.2本地數(shù)據(jù)庫236
11.2.1本地數(shù)據(jù)庫訪問237
11.2.2項目： 簡易留言本239
11.3咖啡商城——購物車本地存儲模塊實現(xiàn)245
11.3.1項目說明245
11.3.2項目設計246
11.3.3項目實施247
習題251第12章jQuery基礎253
12.1jQuery的由來及簡介254
12.1.1向頁面添加jQuery庫254
12.1.2項目： 第一個jQuery程序255
12.2jQuery選擇器256
12.2.1基本選擇器256
12.2.2層次選擇器256
12.2.3過濾選擇器257
12.2.4表單元素選擇器259
12.3jQuery常用方法259
12.4jQuery對象與DOM對象263
12.5jQuery事件264
12.5.1常見的DOM事件264
12.5.2事件綁定/移除267
12.6jQuery動畫269
12.6.1隱藏和顯示269
12.6.2淡入和淡出270
12.6.3animate動畫270
12.7咖啡商城——圖片輪播271
12.7.1項目說明271
12.7.2項目設計272
12.7.3項目實施272
12.8JSON273
12.8.1JSON語法規(guī)則273
12.8.2常用類型274
12.8.3基礎示例274
12.9Ajax275
12.9.1Ajax如何工作275
12.9.2jQuery中的Ajax277
12.10咖啡商城——查看商品詳情279
12.10.1項目說明279
12.10.2項目設計279
12.10.3項目實施280
習題281第13章跨平臺移動App開發(fā)285
13.1HTML5 Plus規(guī)范286
13.2HTML5+ App286
13.3HelloMUI示例287
13.4建立MUI項目289
13.5咖啡商城——移動App291
13.5.1項目說明291
13.5.2項目設計292
13.5.3項目實施292
13.6Hello H5+ 示例294
13.7創(chuàng)建Hello H5+ 項目296
13.8項目： 語音答題App301
13.8.1項目說明301
13.8.2項目設計302
13.8.3項目實施302第14章網(wǎng)站綜合設計305
14.1項目構(gòu)思306
14.2UI設計309
14.3網(wǎng)頁制作314附錄A學習知識點及能力要點324
A.1教材的知識要點及掌握程度324
A.2教材的能力要點及重要程度325附錄BRGB顏色對照表326附錄C部分習題參考答案331參考文獻335