HTML5+CSS3Web前端開發

第1章Web前端開發概述/1
1.1Web前端開發與網頁設計/1
1.1.1網頁的概念和本質/1
1.1.2網頁設計的兩個基本問題/2
1.1.3網頁設計語言——HTML簡介/3
1.1.4網頁製作軟體/4
1.2網站的創建和製作流程/5
1.2.1網站的特徵/5
1.2.2網站的開發步驟/6
1.2.3在Dreamweaver中建立網站/8
1.3Web伺服器與流覽器/10
1.3.1Web伺服器的作用/11
1.3.2流覽器的種類和作用/11
1.4URL與功能變數名稱/13
習題1/14第2章HTML/15
2.1HTML概述/15
2.1.1HTML文檔的結構/15
2.1.2Dreamweaver的開發介面/16
2.1.3使用DW新建HTML檔/17
2.1.4HTML標記/17
2.1.5常見的HTML標記及屬性/18
2.2在網頁中添加文本和圖像/19
2.2.1創建文本和清單/19
2.2.2插入圖像/21
2.3利用DW代碼視圖提高效率/22
2.3.1代碼提示/23
2.3.2代碼快速定位/23
2.3.3DW中的常用快速鍵/24
2.4創建超連結/25
2.4.1超連結標記＜a＞/252.4.2絕對URL與相對URL/27
2.4.3超連結的種類/28
2.4.4超連結目標的打開方式/30
2.4.5超連結製作的原則/30
2.4.6DW中超連結屬性面板的使用/31
2.5插入Flash及嵌入其他網頁/32
2.5.1插入Flash /32
2.5.2嵌入式框架標記＜iframe＞/33
2.6頭部標記/34
習題/35第3章HTML5與Web標準/36
3.1HTML5的改進/36
3.1.1HTML5新增的標記/36
3.1.2HTML5語法的改進/38
3.1.3HTML5的視音訊功能/39
3.1.4HTML5的繪圖功能/41
3.2Web標準/44
3.2.1傳統HTML的缺點/44
3.2.2Web標準的含義/45
3.2.3Web標準的優勢/47
3.3HTML元素的概念/47
3.3.1行內元素和塊級元素/48
3.3.2＜div＞和＜span＞標記/48
習題/49第4章CSS樣式美化/50
4.1CSS基礎/50
4.1.1CSS的語法/50
4.1.2在HTML中引入CSS的方法/51
4.1.3選擇器的分類/53
4.1.4CSS文本修飾/56
4.2CSS的特性/57
4.2.1CSS的層疊性/57
4.2.2CSS的繼承性/59
4.2.3選擇器的組合/60
4.3CSS高級選擇器/64
4.3.1關係選擇器/64
4.3.2屬性選擇器/66
4.3.3偽類別選取器/67
4.3.4使用過渡屬性配合動態偽類效果/70
4.3.5偽元素選擇器/73
4.4CSS設計和書寫技巧/75
4.4.1CSS樣式總體設計原則/75
4.4.2DW對CSS的視覺化編輯支援/76
4.4.3CSS屬性的值和單位/79
4.4.4網頁中的字體/80
4.4.5字體圖示技術/82
4.5盒子模型及其屬性/84
4.5.1盒子模型概述/84
4.5.2邊框border屬性/85
4.5.3圓角borderradius屬性/87
4.5.4圖像邊框borderimage屬性/89
4.5.5padding和margin屬性/91
4.6標準流下的定位及應用/92
4.6.1標準流下的定位原則/92
4.6.2margin合併現象/95
4.6.3盒子模型的應用/96
4.6.4Chrome流覽器的CSS調試功能/99
4.7背景的運用/100
4.7.1CSS的背景屬性/100
4.7.2背景的基本運用技術/104
4.7.3滑動門技術/107
4.7.4背景圖像的翻轉/111
4.7.5傳統圓角效果/112
4.8CSS3樣式美化功能/114
4.8.1陰影和發光效果/114
4.8.2漸變效果/117
4.8.3描邊效果/120
4.8.4遮罩效果/121
4.9變形與動畫效果/123
4.9.1平面變形效果/123
4.9.23D變換效果/126
4.9.3animation動畫效果/131
習題/134第5章CSS佈局/137
5.1浮動/137
5.1.1盒子浮動後的特點/137
5.1.2清除浮動元素的影響/140
5.1.3清除浮動影響的方法/140
5.2浮動的應用舉例/143
5.2.1圖文混排及首字下沉效果/143
5.2.2水準導航條/144
5.2.3新聞欄目框/145
5.2.4微博對話方塊/148
5.3相對定位/149
5.3.1定位屬性和偏移屬性/149
5.3.2相對定位的特點/149
5.3.3相對定位的應用舉例/150
5.4絕對定位和固定定位/152
5.4.1絕對定位/152
5.4.2絕對定位的應用舉例/154
5.4.3固定定位/163
5.4.4與定位屬性有關的CSS屬性/163
5.4.5overflow屬性/166
5.4.6verticalalign屬性/167
5.5CSS分欄佈局/168
5.5.1分欄佈局的種類/169
5.5.2網頁居中的方法/170
5.5.3131版式網頁佈局/170
5.5.4121可變寬度佈局/174
5.5.5CSS兩列佈局案例/176
5.5.6HTML5 新增的文檔結構標記/181
5.5.7HTML5網頁佈局案例/183
5.6CSS3新增的佈局方式/186
5.6.1彈性盒佈局/186
5.6.2分欄佈局/190
5.7CSS流覽器的相容問題/192
習題/193第6章表格與表單/195
6.1創建表格/195
6.1.1表格標記/195
6.1.2表格行和儲存格標記/197
6.1.3在DW中動作表格的方法/199
6.1.4製作固定寬度的表格/201
6.1.5特殊效果表格的製作/201
6.2使用CSS美化表格/203
6.2.1邊框和背景的美化/203
6.2.2隔行變色效果/204
6.3創建表單/205
6.3.1＜form＞標記及其屬性/206
6.3.2＜input＞標記/208
6.3.3＜select＞和＜option＞標記/211
6.3.4多行文本域標記＜textarea＞/211
6.3.5表單數據的傳遞過程/212
6.3.6表單中的按鈕/213
6.3.7表單的輔助標記/214
6.3.8HTML5新增的表單標記和屬性/215
6.4美化表單/218
6.4.1搜索框/218
6.4.2用戶登錄表單/219
6.4.3用戶註冊表單/222
習題/223第7章回應式網頁設計/225
7.1回應式網頁的基本技術/225
7.1.1媒體查詢/225
7.1.2流式佈局/227
7.1.3自我調整圖片/229
7.1.4一列變寬、一列固定的方法/231
7.1.5回應式網頁的頭部代碼設置/231
7.2回應式佈局的網站實例/232
7.2.1頁面總體佈局的實現/233
7.2.2頁頭的設計/235
7.2.3響應式導航條的製作/235
7.2.4響應式欄目的製作/237
習題/239第8章JavaScript與jQuery基礎/240
8.1JavaScript的代碼結構/240
8.2JavaScript的事件程式設計/242
8.2.1JavaScript語言基礎/242
8.2.2常用JavaScript事件/242
8.2.3事件監聽程式/243
8.3JavaScript DOM程式設計/245
8.3.1動態效果的實現/245
8.3.2獲取指定元素/246
8.3.3訪問元素的CSS屬性/247
8.3.4訪問元素的內容/249
8.4使用流覽器物件/249
8.5jQuery基礎/253
8.5.1jQuery的功能和使用/253
8.5.2jQuery中的“＄”/254
8.5.3jQuery物件與DOM物件/258
8.5.4jQuery的選擇器/260
8.5.5jQuery的事件綁定/261
8.5.6jQuery中的常用方法/262
8.5.7jQuery應用舉例/263
習題/265第9章Bootstrap回應式網頁設計/267
9.1Bootstrap的使用/267
9.1.1下載和引用Bootstrap框架/267
9.1.2Bootstrap柵格系統/269
9.1.3使用柵格系統進行回應式佈局/271
9.2Bootstrap中的網頁組件/277
9.2.1基於元件的網頁製作方法/277
9.2.2導航條/279
9.2.3輪播外掛程式/283
9.2.4選項卡面板/286
9.2.5媒體對象/288
9.2.6折疊面板組/290
9.2.7提示框與彈出框/292
9.2.8模態彈窗/293
9.3Bootstrap網頁重構實例/295
習題/297附錄實驗/299
實驗1個人簡歷網頁/299
實驗2圓餅型盒子的製作/299
實驗3製作背景翻轉的圖示/300
實驗4欄目框的製作/300
實驗5頁頭和導航條的製作/301
實驗6圖片滾動欄的製作/301
實驗7網頁的佈局設計/301
實驗8網站首頁的實現/301
實驗9網站列表頁的實現/301
實驗10製作下拉式功能表/302
實驗11製作Tab面板/302
實驗12使用Bootstrap製作響應式網頁/302參考文獻/303