響應式Web開發(fā)項目化教程(HTML5+CSS3)
定 價:49 元
- 作者:孫曉娟
- 出版時間:2020/7/1
- ISBN:9787121392757
- 出 版 社:電子工業(yè)出版社
- 中圖法分類:TP312;TP393.092
- 頁碼:236
- 紙張:
- 版次:01
- 開本:16開
近年來,互聯(lián)網(wǎng)在各個領域的普及,使Web前端開發(fā)技術(shù)的發(fā)展速度十分迅猛,而HTML5+CSS3更是已經(jīng)成為Web前端開發(fā)技術(shù)的主流,從而使Web前端開發(fā)技術(shù)具備了更多新的功能特性。本書從Web前端開發(fā)實際應用的角度出發(fā),以企業(yè)實際項目為核心,由淺入深地講解了HTML5、CSS3及響應式Web前端開發(fā)技術(shù)。本書共10個項目,前9個項目從項目描述、前導知識、項目分析、項目實踐、項目總結(jié)5個方面對各項目進行了系統(tǒng)的講解,幫助讀者快速理解并掌握各項目的重點知識,最后通過項目10的企業(yè)真實項目實戰(zhàn)對響應式Web前端開發(fā)全過程進行梳理和講解,全面提高讀者分析問題、解決問題及動手操作的能力。本書包含配套教學計劃、教案、教學PPT、教學案例、源代碼、課后習題等資源,讀者可登錄華信教育資源網(wǎng)(http://www.hxedu.com.cn)注冊后免費下載。本書適用面廣,既可作為高職院校、培訓機構(gòu)的Web前端開發(fā)教材,也可作為網(wǎng)頁設計、網(wǎng)站開發(fā)、網(wǎng)頁編程等課程的教材及參考書。
孫曉娟,參加工作以來,一直從事Web開發(fā)和計算機軟件方向的研究與教學工作,撰寫論文20余篇,多次獲得省級教學成果獎,教育部優(yōu)秀指導教師等榮譽。2017年至今,多次擔任遼寧省職業(yè)技能大賽高職、中職組的計算機檢測與維修、電子商務賽項的評委。
項目1 制作HBuilder百科頁面 1
1.1 項目描述 1
1.2 前導知識 1
1.2.1 初識HTML5 1
1.2.2 HTML5基礎 4
1.2.3 文本控制元素 6
1.2.4 圖像控制元素 9
1.2.5 超鏈接元素 9
1.2.6 列表元素 10
1.2.7 結(jié)構(gòu)元素 13
1.2.8 分組元素 18
1.2.9 內(nèi)容交互元素 20
1.3 項目分析 21
1.3.1 頁面結(jié)構(gòu)分析 21
1.3.2 樣式分析 22
1.4 項目實踐 23
1.4.1 制作頁面結(jié)構(gòu) 23
1.4.2 定義CSS樣式 24
1.5 項目總結(jié) 24
項目2 制作化妝品展示列表頁面 25
2.1 項目描述 25
2.2 前導知識 25
2.2.1 初識CSS 25
2.2.2 引入CSS樣式與CSS語法格式 26
2.2.3 CSS基礎選擇器 29
2.2.4 偽元素選擇器 35
2.2.5 鏈接偽類 36
2.2.6 結(jié)構(gòu)化偽類選擇器 37
2.2.7 CSS的層疊性與繼承性 42
2.2.8 CSS的優(yōu)先級 44
2.2.9 字體樣式屬性與文本樣式屬性 45
2.3 項目分析 52
2.3.1 頁面結(jié)構(gòu)分析 52
2.3.2 樣式分析 52
2.4 項目實踐 53
2.4.1 制作頁面結(jié)構(gòu) 53
2.4.2 定義CSS樣式 54
2.5 項目總結(jié) 54
項目3 制作電商主播排行榜頁面 55
3.1 項目描述 55
3.2 前導知識 55
3.2.1 初識盒模型 55
3.2.2 邊框?qū)傩?57
3.2.3 邊距屬性 64
3.2.4 box-sizing屬性 67
3.2.5 陰影屬性 68
3.2.6 漸變屬性 69
3.2.7 背景屬性 72
3.3 項目分析 77
3.3.1 頁面結(jié)構(gòu)分析 77
3.3.2 樣式分析 78
3.4 項目實踐 78
3.4.1 制作頁面結(jié)構(gòu) 78
3.4.2 定義CSS樣式 78
3.5 項目總結(jié) 79
項目4 制作家裝行業(yè)產(chǎn)品展示頁面 80
4.1 項目描述 80
4.2 前導知識 81
4.2.1 過渡 81
4.2.2 變形 85
4.2.3 動畫 92
4.3 項目分析 94
4.3.1 頁面結(jié)構(gòu)分析 94
4.3.2 樣式分析 95
4.4 項目實踐 95
4.4.1 制作頁面結(jié)構(gòu) 95
4.4.2 定義CSS樣式 97
4.5 項目總結(jié) 99
項目5 制作旅游網(wǎng)站的導航欄和banner 100
5.1 項目描述 100
5.2 前導知識 100
5.2.1 元素的浮動屬性float 100
5.2.2 元素的清除浮動屬性clear 102
5.2.3 元素的位置定位屬性position 103
5.2.4 元素的類型轉(zhuǎn)換 108
5.3 項目分析 111
5.3.1 頁面結(jié)構(gòu)分析 111
5.3.2 樣式分析 111
5.4 項目實踐 111
5.4.1 制作頁面結(jié)構(gòu) 111
5.4.2 定義CSS樣式 112
5.5 項目總結(jié) 114
項目6 制作信息注冊頁面 115
6.1 項目描述 115
6.2 前導知識 115
6.2.1 表單概述 115
6.2.2 表單元素及屬性 117
6.2.3 表單校驗 129
6.3 項目分析 131
6.3.1 頁面結(jié)構(gòu)分析 131
6.3.2 樣式分析 132
6.4 項目實踐 132
6.4.1 制作頁面結(jié)構(gòu) 132
6.4.2 定義CSS樣式 135
6.5 項目總結(jié) 138
項目7 制作視頻播放頁面 139
7.1 項目描述 139
7.2 前導知識 139
7.2.1 多媒體的格式 139
7.2.2 支持視頻和音頻的瀏覽器 140
7.2.3 嵌入視頻 140
7.2.4 HTML DOM Video對象 141
7.2.5 嵌入音頻 143
7.2.6 HTML DOM Audio對象 143
7.2.7 視頻、音頻中的source
元素 145
7.3 項目分析 145
7.3.1 頁面結(jié)構(gòu)分析 145
7.3.2 樣式分析 146
7.4 項目實踐 146
7.4.1 制作頁面結(jié)構(gòu) 146
7.4.2 定義CSS樣式 147
7.5 項目總結(jié) 148
項目8 制作垃圾分類頁面 149
8.1 項目描述 149
8.2 前導知識 150
8.2.1 視口 150
8.2.2 媒體查詢 152
8.2.3 百分比布局 158
8.3 項目分析 161
8.3.1 頁面結(jié)構(gòu)分析 161
8.3.2 樣式分析 161
8.4 項目實踐 162
8.4.1 制作頁面結(jié)構(gòu) 162
8.4.2 定義CSS樣式 164
8.5 項目總結(jié) 171
項目9 制作個人信息頁面 172
9.1 項目描述 172
9.2 前導知識 173
9.2.1 柵格系統(tǒng) 173
9.2.2 彈性盒布局 176
9.3 項目分析 190
9.3.1 頁面結(jié)構(gòu)分析 190
9.3.2 樣式分析 190
9.4 項目實踐 191
9.4.1 制作頁面結(jié)構(gòu) 191
9.4.2 定義CSS樣式 194
9.5 項目總結(jié) 201
項目10 制作物流公司響應式網(wǎng)站 202
10.1 項目描述 202
10.2 頁面結(jié)構(gòu)搭建 206
10.2.1 頁面結(jié)構(gòu)搭建的內(nèi)容 206
10.2.2 模塊結(jié)構(gòu) 206
10.2.3 代碼實現(xiàn) 206
10.3 頂部通欄 208
10.3.1 頂部通欄結(jié)構(gòu) 208
10.3.2 代碼實現(xiàn) 208
10.4 導航欄 209
10.4.1 導航欄結(jié)構(gòu) 209
10.4.2 代碼實現(xiàn) 210
10.5 輪播圖 211
10.5.1 輪播圖結(jié)構(gòu) 211
10.5.2 代碼實現(xiàn) 212
10.6 關于我們模塊 214
10.6.1 關于我們模塊結(jié)構(gòu) 214
10.6.2 代碼實現(xiàn) 215
10.7 我們的優(yōu)勢模塊 216
10.7.1 我們的優(yōu)勢模塊結(jié)構(gòu) 216
10.7.2 代碼實現(xiàn) 217
10.8 我們的服務模塊 219
10.8.1 我們的服務模塊結(jié)構(gòu) 219
10.8.2 代碼實現(xiàn) 221
10.9 運輸物流模塊 222
10.9.1 運輸物流模塊結(jié)構(gòu) 222
10.9.2 代碼實現(xiàn) 223
10.10 最新資訊模塊 224
10.10.1 最新資訊模塊結(jié)構(gòu) 224
10.10.2 代碼實現(xiàn) 225
10.11 版尾 227
10.11.1 版尾結(jié)構(gòu) 227
10.11.2 代碼實現(xiàn) 228
10.12 項目總結(jié) 228
參考文獻 228