Web前端開發(fā)案例教程(HTML5+CSS3)(項目式微課版)
定 價:49.8 元
- 作者:李志云 董文華
- 出版時間:2024/1/1
- ISBN:9787115625274
- 出 版 社:人民郵電出版社
- 中圖法分類:TP393.092.2
- 頁碼:203
- 紙張:
- 版次:01
- 開本:大16開
本書是“十三五”“十四五”職業(yè)教育國家規(guī)劃教材,是適切線上線下混合式教學而推出的新形態(tài)一體化教材。全書以企業(yè)開發(fā)的學校真實網(wǎng)站為載體,將學校網(wǎng)站項目拆分為10個任務,按照“任務描述→知識準備→任務實現(xiàn)→實訓”序化教材內容,采用項目貫穿、任務驅動的方式組織學習,通過任務實現(xiàn)學習HTML5語言、CSS3層疊樣式表、盒子模型、表格與表單、HTML5+CSS3布局等網(wǎng)站開發(fā)技術。在關鍵知識點、任務實現(xiàn)及實訓中嵌入二維碼,供學生課前或課后觀看。
本書可以作為中職或高職院校計算機相關專業(yè)“Web前端開發(fā)”或“網(wǎng)頁設計”課程的教材,也可以作為Web前端開發(fā)愛好者的學習參考書。
1.深刻領會二十大精神,自然融入思政元素
2.“十四五”“十三五”職業(yè)教育國家規(guī)劃教材
3.采用項目任務式教學,完整任務貫穿
4.校企合作開發(fā)、深化產(chǎn)教融合
5.大量優(yōu)質微課視頻和教學資源,便于進行線上線下混合式教學
6.學練結合,配豐富的課后習題,增加拓展學習和拓展閱讀內容
李志云,工學碩士學位,副教授,研究方向為Web應用技術、數(shù)據(jù)庫技術和高職教育研究;主持的“標準對接、項目引領、價值融入:《Web前端開發(fā)》教學內容和模式改革實踐”獲省級教學成果二等獎;山東省職業(yè)教育課程思政示范課程《Web前端開發(fā)》主持人;主編教材四部,其中兩部獲批“十四五”“十三五”職業(yè)教育國家規(guī)劃教材,發(fā)表論文二十余篇。
任務1 創(chuàng)建第一個HTML5網(wǎng)頁 1
1.1 任務描述 2
1.2 知識準備 2
1.2.1 認識Web前端開發(fā) 2
1.2.2 Web相關概念 2
1.2.3 HTML5概述 5
1.2.4 常用的瀏覽器 5
1.2.5 網(wǎng)頁編輯軟件 6
1.3 任務實現(xiàn) 6
任務小結 8
習題1 9
實訓1 10
擴展閱讀 10
任務2 搭建簡單學院網(wǎng)站 12
2.1 任務描述 13
2.2 知識準備 13
2.2.1 HTML5文檔的基本結構 14
2.2.2 HTML標記及其屬性 15
2.2.3 HTML文本標記 16
2.2.4 HTML列表標記 22
2.2.5 HTML超鏈接標記 26
2.2.6 HTML圖像標記 29
2.3 任務實現(xiàn) 32
2.3.1 創(chuàng)建網(wǎng)站目錄 32
2.3.2 創(chuàng)建網(wǎng)站首頁 32
2.3.3 創(chuàng)建學院簡介頁面 33
2.3.4 創(chuàng)建學院新聞頁面 33
2.3.5 創(chuàng)建新聞詳情頁面 34
任務小結 35
習題2 36
實訓2 37
擴展閱讀 38
任務3 美化簡單學院網(wǎng)站 40
3.1 任務描述 41
3.2 知識準備 41
3.2.1 什么是CSS 41
3.2.2 引入CSS樣式 42
3.2.3 CSS常用選擇器 46
3.2.4 CSS常用文本屬性 52
3.2.5 CSS的高級特性 55
3.3 任務實現(xiàn) 58
3.3.1 美化網(wǎng)站首頁 58
3.3.2 美化學院簡介頁面 59
3.3.3 美化學院新聞頁面 60
3.3.4 美化新聞詳情頁面 61
任務小結 62
習題3 63
實訓3 64
擴展閱讀 65
任務4 制作學院介紹頁面 66
4.1 任務描述 67
4.2 知識準備 67
4.2.1 盒子模型的概念 67
4.2.2 盒子模型的相關屬性 69
4.2.3 背景屬性 74
4.2.4 不透明度屬性 80
4.3 任務實現(xiàn) 81
4.3.1 搭建學院介紹頁面結構 81
4.3.2 定義學院介紹頁面CSS樣式 82
任務小結 82
習題4 83
實訓4 85
擴展閱讀 85
任務5 制作學院網(wǎng)站導航條 87
5.1 任務描述 88
5.2 知識準備 88
5.2.1 無序列表樣式設置 88
5.2.2 超鏈接樣式設置 89
5.2.3 元素的類型與轉換 91
5.3 任務實現(xiàn) 94
5.3.1 搭建學院網(wǎng)站導航條結構 94
5.3.2 定義學院網(wǎng)站導航條CSS樣式 95
任務小結 96
習題5 96
實訓5 97
擴展閱讀 98
任務6 制作學院新聞塊 99
6.1 任務描述 100
6.2 知識準備 100
6.2.1 元素的浮動 100
6.2.2 塊元素間的外邊距 104
6.3 任務實現(xiàn) 109
6.3.1 搭建學院新聞塊頁面結構 109
6.3.2 定義學院新聞塊CSS樣式 110
任務小結 111
習題6 112
實訓6 112
擴展閱讀 113
任務7 制作學生信息表 115
7.1 任務描述 116
7.2 知識準備 116
7.2.1 表格標記 116
7.2.2 合并單元格 118
7.2.3 使用CSS定義表格樣式 119
7.3 任務實現(xiàn) 121
7.3.1 搭建學生信息表結構 121
7.3.2 定義學生信息表CSS樣式 123
任務小結 124
習題7 125
實訓7 125
擴展閱讀 126
任務8 制作學生問卷調查表單 127
8.1 任務描述 128
8.2 知識準備 128
8.2.1 認識表單 128
8.2.2 表單標記 129
8.2.3 表單控件 129
8.2.4 使用CSS定義表單樣式 133
8.3 任務實現(xiàn) 135
8.3.1 搭建學生問卷調查表單頁面結構 135
8.3.2 使用CSS定義學生問卷調查表單頁面樣式 137
任務小結 138
習題8 138
實訓8 140
擴展閱讀 140
任務9 制作學院風景墻頁面 141
9.1 任務描述 142
9.2 知識準備 142
9.2.1 過渡屬性 142
9.2.2 變形屬性 148
9.3 任務實現(xiàn) 151
9.3.1 搭建學院風景墻頁面結構 151
9.3.2 定義學院風景墻頁面CSS樣式 152
任務小結 153
習題9 154
實訓9 155
擴展閱讀 156
任務10 布局學院網(wǎng)站主頁 157
10.1 任務描述 158
10.2 知識準備 158
10.2.1 單列布局 158
10.2.2 二列布局 160
10.2.3 三列布局 162
10.2.4 通欄布局 164
10.3 任務實現(xiàn) 164
10.3.1 搭建布局塊結構 164
10.3.2 定義布局塊CSS樣式 165
任務小結 168
習題10 169
實訓10 169
擴展閱讀 170
任務11 完整項目:制作學院網(wǎng)站 171
11.1 任務描述 172
11.2 網(wǎng)站規(guī)劃 172
11.3 效果圖設計 173
11.3.1 效果圖設計原則 173
11.3.2 效果圖設計步驟 173
11.3.3 效果圖切片導出素材 178
11.4 制作網(wǎng)站主頁 178
11.5 制作新聞列表頁 194
11.6 制作新聞詳情頁 199
11.7 制作視頻宣傳頁 200
任務小結 202
實訓11 202
擴展閱讀 203
參考文獻 204