Web前端開發(fā)案例教程——HTML5+CSS3+JavaScript+JQuery+Bootstrap響應(yīng)式開發(fā)
定 價:59.8 元
- 作者:胡軍 劉伯成 管春
- 出版時間:2020/9/1
- ISBN:9787115536037
- 出 版 社:人民郵電出版社
- 中圖法分類:TP393.092.2
- 頁碼:308
- 紙張:膠版紙
- 版次:02
- 開本:16K
本書全面系統(tǒng)地介紹了網(wǎng)頁設(shè)計、開發(fā)涉及的主要技術(shù)和技巧。主要內(nèi)容包括:Web前端開發(fā)概述、HTML5基礎(chǔ)、表格和表單、框架、CSS樣式表、CSS樣式表布局、HTML5、CSS3綜合案例、JavaScript基礎(chǔ)、JavaScript對象、JavaScript DOM、JQuery基礎(chǔ)、JQuery應(yīng)用、響應(yīng)式布局、Bootstrap。
1. 介紹了HTML5開發(fā)技術(shù),JQuery框架以及BootStrap響應(yīng)式開發(fā)
2.配圖豐富,效果直觀
3. 以項目開發(fā)為主線,采用邊講邊練的方式
4.配有大量的實用案例,理論和實踐完美結(jié)合
5.綜合案例整合所學(xué)理論知識
劉伯成,南昌大學(xué)軟件學(xué)院副教授, 發(fā)表論文:《基于多Agent智能網(wǎng)絡(luò)教學(xué)系統(tǒng)設(shè)計與實現(xiàn)》、《掌上物流通系統(tǒng)的設(shè)計與實現(xiàn)》、《人工情感與物聯(lián)網(wǎng)技術(shù)研究》等。
第1章 Web前端開發(fā)概述 1
1.1 Web概述 2
1.1.1 Web客戶端技術(shù) 2
1.1.2 Web服務(wù)器端技術(shù) 2
1.1.3 超文本傳輸協(xié)議 3
1.1.4 統(tǒng)一資源定位符 3
1.2 HTML 3
1.2.1 HTML簡介 3
1.2.2 HTML的發(fā)展 4
1.3 CSS 4
1.3.1 CSS簡介 4
1.3.2 CSS的特點 5
1.4 JavaScript 5
1.4.1 JavaScript簡介 5
1.4.2 JavaScript的特點 6
1.5 jQuery 6
1.6 Bootstrap 7
1.7 其他前端框架 7
1.7.1 Angular 7
1.7.2 React 7
1.7.3 Vue 7
小結(jié) 8
第2章 HTML5基礎(chǔ)Ⅰ 9
2.1 HTML5的新特性 10
2.2 HTML5文檔結(jié)構(gòu) 11
2.2.1 基本結(jié)構(gòu) 11
2.2.2 編輯工具 12
2.3 HTML5頭部標(biāo)簽 13
2.3.1
標(biāo)簽 13
2.3.2 <meta />標(biāo)簽 14
2.3.3 <link />標(biāo)簽 14
2.3.4
<style>標(biāo)簽 14
2.3.5
<script>標(biāo)簽 15
2.4 塊級標(biāo)簽 15
2.4.1 基本的塊級標(biāo)簽 15
2.4.2 常用于布局的塊級標(biāo)簽 17
2.5 行級標(biāo)簽 22
2.5.1 圖像標(biāo)簽<img /> 22
2.5.2 圖片列表標(biāo)簽<figure>和<figcaption> 23
2.5.3 范圍標(biāo)簽<span> 25
2.5.4 換行標(biāo)簽<br /> 25
2.5.5 超鏈接標(biāo)簽<a> 26
2.6 W3C標(biāo)準(zhǔn) 30
2.6.1 W3C提倡的Web頁面結(jié)構(gòu) 30
2.6.2 HTML5的基本規(guī)范、結(jié)構(gòu)元素和媒體支持 31
2.7 實踐指導(dǎo) 34
小結(jié) 35
拓展訓(xùn)練 36
第3章 HTML5基礎(chǔ)Ⅱ 37
3.1 表格基礎(chǔ) 38
3.1.1 表格結(jié)構(gòu) 39
3.1.2 表格標(biāo)簽 40
3.1.3 表格屬性設(shè)置 41
3.1.4 跨行和跨列設(shè)置 42
3.2 表單 45
3.2.1 表單標(biāo)簽 47
3.2.2 表單域 47
3.2.3 表單按鈕 53
3.2.4 HTML5新增的表單屬性 54
3.2.5 HTML5新增表單標(biāo)簽 55
3.2.6 表單驗證 56
3.3 表格布局 57
3.3.1 應(yīng)用場景 57
3.3.2 圖文布局 57
3.3.3 表單布局 59
3.3.4 表格的嵌套布局 61
3.4 <iframe>框架 63
3.4.1 <iframe>的用法 64
3.4.2 設(shè)置<iframe>常用屬性 64
3.5 實踐指導(dǎo) 65
小結(jié) 67
拓展訓(xùn)練 67
第4章 CSS3基礎(chǔ) 70
4.1 CSS3簡介 71
4.2 CSS3基本語法 72
4.2.1 CSS3基本結(jié)構(gòu) 72
4.2.2 在HTML5中引入CSS3樣式表 72
4.2.3 CSS3基本選擇器 76
4.2.4 CSS層疊性、繼承性和重要性 80
4.2.5 多選擇器的常用符號及組合 82
4.3 CSS的常用屬性 82
4.3.1 CSS的屬性單位 82
4.3.2 字體屬性 83
4.3.3 文本屬性 85
4.3.4 背景屬性 87
4.3.5 列表的常用屬性 88
4.3.6 超鏈接偽類樣式 89
4.4 實踐指導(dǎo) 91
小結(jié) 93
拓展訓(xùn)練 94
第5章 CSS3布局 95
5.1 盒子模型及應(yīng)用 96
5.1.1 盒子模型 96
5.1.2 盒子屬性 96
5.2 DIV+CSS3布局 100
5.2.1 <div>標(biāo)簽的樣式設(shè)置 100
5.2.2 布局頁面設(shè)置 102
5.2.3 <div>標(biāo)簽的嵌套 103
5.2.4 display屬性 104
5.2.5 <div>標(biāo)簽的浮動 106
5.2.6 <div>標(biāo)簽的定位 109
5.2.7 圓角邊框 112
5.2.8 典型的DIV+CSS3整體頁面布局 113
5.3 典型的局部布局 115
5.3.1 <div>-<ul>-<li>局部布局 115
5.3.2 <div>-<dl>-<dt>-<dd>局部布局 119
5.4 實踐指導(dǎo) 121
小結(jié) 123
拓展訓(xùn)練 124
第6章 網(wǎng)站設(shè)計 125
6.1 網(wǎng)站開發(fā)流程 126
6.1.1 需求分析 126
6.1.2 偽界面設(shè)計 127
6.1.3 網(wǎng)站制作 127
6.1.4 測試網(wǎng)頁 128
6.1.5 發(fā)布網(wǎng)站 128
6.2 創(chuàng)建站點 128
6.3 頁面布局技術(shù) 130
6.3.1 表格布局 130
6.3.2 框架布局 130
6.3.3 DIV+CSS3布局 131
6.4 網(wǎng)頁制作 131
6.4.1 制作首頁布局 131
6.4.2 制作網(wǎng)頁模板 132
6.4.3 制作樣式表文件和其他頁面綁定 133
6.4.4 設(shè)置頁面間的鏈接 135
6.5 測試并發(fā)布網(wǎng)站 135
6.5.1 測試內(nèi)容 135
6.5.2 發(fā)布站點 136
6.6 實踐指導(dǎo) 139
小結(jié) 141
拓展訓(xùn)練 141
第7章 JavaScript基礎(chǔ) 142
7.1 JavaScript簡介 143
7.1.1 JavaScript的基本結(jié)構(gòu) 143
7.1.2 腳本的執(zhí)行原理 145
7.2 JavaScript基礎(chǔ)語法 145
7.2.1 變量 146
7.2.2 數(shù)據(jù)類型 146
7.2.3 注釋 148
7.2.4 運算符 148
7.2.5 常用的輸入/輸出 148
7.3 流程控制 149
7.3.1 分支結(jié)構(gòu) 149
7.3.2 循環(huán)結(jié)構(gòu) 152
7.3.3 轉(zhuǎn)移結(jié)構(gòu) 155
7.4 函數(shù) 157
7.4.1 內(nèi)置系統(tǒng)函數(shù) 157
7.4.2 自定義函數(shù) 159
7.5 實踐指導(dǎo) 160
小結(jié) 164
拓展訓(xùn)練 164
第8章 JavaScript對象 165
8.1 JavaScript核心對象 166
8.1.1 數(shù)組對象 166
8.1.2 字符串對象 167
8.1.3 日期對象 170
8.1.4 數(shù)學(xué)對象 173
8.2 自定義對象 175
8.2.1 對象的制作和使用 175
8.2.2 在對象內(nèi)設(shè)定方法 177
8.2.3 將對象作為對象屬性使用 178
8.3 JavaScript的事件 180
8.4 實踐指導(dǎo) 182
小結(jié) 183
拓展訓(xùn)練 183
第9章 JavaScript DOM 185
9.1 DOM概述 186
9.2 window對象 187
9.2.1 常用屬性 187
9.2.2 常用方法 187
9.2.3 常用事件 189
9.3 document對象 191
9.3.1 常用屬性 191
9.3.2 常用方法 192
9.4 其他對象 194
9.4.1 history對象 194
9.4.2 location對象 195
9.4.3 表單對象 196
9.5 DOM編程應(yīng)用 198
9.5.1 元素的顯示和隱藏 198
9.5.2 復(fù)選框全選效果 202
9.6 實踐指導(dǎo) 204
小結(jié) 205
拓展訓(xùn)練 205
第10章 jQuery基礎(chǔ) 206
10.1 jQuery簡介 207
10.1.1 jQuery的使用 207
10.1.2 jQuery工廠函數(shù) 208
10.2 DOM對象與jQuery對象的相互轉(zhuǎn)換 208
10.3 jQuery的選擇器 210
10.3.1 基本選擇器 210
10.3.2 層次選擇器 211
10.3.3 過濾選擇器 213
10.3.4 表單選擇器 221
10.4 實踐指導(dǎo) 223
小結(jié) 223
拓展訓(xùn)練 223
第11章 jQuery應(yīng)用 224
11.1 jQuery的事件綁定 225
11.1.1 jQuery事件 225
11.1.2 常用的綁定方法 225
11.1.3 使用jQuery操作DOM 227
11.2 jQuery的動畫函數(shù) 236
11.2.1 show()和hide()函數(shù) 236
11.2.2 fadeIn()和fadeOut()函數(shù) 237
11.2.3 自定義動畫 238
11.3 jQuery的簡單應(yīng)用 239
11.3.1 功能需求 239
11.3.2 功能實現(xiàn) 240
11.4 實踐指導(dǎo) 246
小結(jié) 246
拓展訓(xùn)練 246
第12章 響應(yīng)式布局 247
12.1 視口 248
12.1.1 PC端視口 248
12.1.2 移動端視口 248
12.2 媒體查詢與百分比布局 250
12.2.1 媒體查詢 250
12.2.2 百分比布局 251
12.3 柵格系統(tǒng) 254
12.3.1 柵格系統(tǒng)簡介 254
12.3.2 柵格系統(tǒng)的應(yīng)用 254
12.4 彈性盒布局 255
12.4.1 彈性盒布局簡介 255
12.4.2 彈性盒布局的應(yīng)用 258
12.5 實踐指導(dǎo) 261
小結(jié) 262
拓展訓(xùn)練 262
第13章 Bootstrap技術(shù) 263
13.1 Bootstrap技術(shù)簡介 264
13.1.1 Bootstrap技術(shù)基本介紹 264
13.1.2 Bootstrap技術(shù)的基本用法 264
13.2 柵格系統(tǒng) 265
13.3 CSS全局樣式 269
13.3.1 基礎(chǔ)排版 269
13.3.2 表單 270
13.3.3 按鈕 273
13.3.4 圖片 273
13.4 Bootstrap組件 274
13.4.1 圖標(biāo) 274
13.4.2 下拉菜單 276
13.4.3 輸入框 278
13.4.4 導(dǎo)航與導(dǎo)航條 279
13.4.5 縮略圖與媒體對象 286
13.4.6 列表組 289
13.5 實踐指導(dǎo) 290
小結(jié) 291
拓展訓(xùn)練 291
第14章 綜合案例 292
14.1 網(wǎng)頁概述 293
14.1.1 導(dǎo)航條 293
14.1.2 搜索欄 293
14.1.3 滾動式信息欄 294
14.1.4 其他網(wǎng)頁元素 294
14.2 導(dǎo)航條 295
14.3 搜索欄 298
14.4 滾動式推薦欄 299
14.5 其他網(wǎng)頁元素 301
14.5.1 用戶信息欄 301
14.5.2 美食信息欄 302
14.5.3 特殊服務(wù)欄 303
14.5.4 外部鏈接欄 304
14.5.5 網(wǎng)頁信息欄 305
14.5.6 至頂(to-top) 306
小結(jié) 308
拓展訓(xùn)練 308