網(wǎng)頁(yè)設(shè)計(jì)項(xiàng)目教程
定 價(jià):58 元
- 作者:王婷婷
- 出版時(shí)間:2024/1/1
- ISBN:9787121469039
- 出 版 社:電子工業(yè)出版社
- 中圖法分類:TP393.092.2
- 頁(yè)碼:312
- 紙張:
- 版次:01
- 開(kāi)本:16開(kāi)
本書(shū)從初學(xué)者的角度出發(fā),以一個(gè)完整的旅游網(wǎng)站前端頁(yè)面的開(kāi)發(fā)項(xiàng)目為載體,按照項(xiàng)目開(kāi)發(fā)流程和學(xué)生的認(rèn)知規(guī)律,由淺入深、循序漸進(jìn)地將HTML5和CSS3的理論知識(shí)和關(guān)鍵技術(shù)融入各個(gè)工作任務(wù)中。通過(guò)具體任務(wù)的實(shí)施及項(xiàng)目的完整實(shí)現(xiàn),使學(xué)生能夠快速掌握網(wǎng)站前端頁(yè)面開(kāi)發(fā)相關(guān)的理論知識(shí)和職業(yè)技能,從而獨(dú)立設(shè)計(jì)開(kāi)發(fā)各種類型的商業(yè)網(wǎng)站。本書(shū)包含12個(gè)項(xiàng)目,項(xiàng)目涉及的主要知識(shí)點(diǎn)和技能點(diǎn)包括:網(wǎng)站開(kāi)發(fā)環(huán)境的選取和配置、DIV+CSS頁(yè)面布局技術(shù)、HTML5標(biāo)記與CSS3樣式屬性的使用、浮動(dòng)與定位的設(shè)置、HTML5音視頻技術(shù)、表單的應(yīng)用、CSS3的動(dòng)畫(huà)制作、響應(yīng)式頁(yè)面開(kāi)發(fā)、彈性盒布局技術(shù)等,并配有微課視頻、課件、源代碼、任務(wù)拓展、閱讀拓展、習(xí)題等數(shù)字教學(xué)資源。
王婷婷,女,1983年3月出生,山東德州人,畢業(yè)于山東大學(xué)計(jì)算機(jī)學(xué)院,F(xiàn)任濟(jì)南職業(yè)學(xué)院計(jì)算機(jī)學(xué)院軟件技術(shù)專業(yè)副主任、web前端開(kāi)發(fā)專業(yè)方向負(fù)責(zé)人、web前端開(kāi)發(fā)“1+X”證書(shū)試點(diǎn)工作負(fù)責(zé)人。作為第一主講人多次參加職業(yè)院校信息化教學(xué)大賽,獲得國(guó)賽二等獎(jiǎng)1項(xiàng)、三等獎(jiǎng)1項(xiàng),省賽一等獎(jiǎng)2項(xiàng)、二等獎(jiǎng)1項(xiàng);指導(dǎo)學(xué)生參加職業(yè)院校技能大賽,獲得全國(guó)一等獎(jiǎng)1項(xiàng),省賽二等獎(jiǎng)2項(xiàng)、三等獎(jiǎng)1項(xiàng)。在省級(jí)及以上刊物發(fā)表多篇論文,編寫多本教材,申報(bào)了多項(xiàng)軟件著作權(quán);取得“計(jì)算機(jī)裝調(diào)員”職業(yè)資格證書(shū),獲得雙師型教師認(rèn)定;參與多個(gè)企業(yè)項(xiàng)目研發(fā),具有較好的行業(yè)影響力。
項(xiàng)目1 制作第一個(gè)網(wǎng)頁(yè) 1
任務(wù)1.1 認(rèn)識(shí)網(wǎng)頁(yè)、瀏覽器與WWW 1
1.1.1 Web的發(fā)展歷程和相關(guān)概念 2
1.1.2 常用瀏覽器 5
1.1.3 HTML5的發(fā)展歷程和相關(guān)概念 5
任務(wù)1.2 創(chuàng)建第一個(gè)HTML5網(wǎng)頁(yè) 6
1.2.1 建立網(wǎng)站的目錄結(jié)構(gòu) 7
1.2.2 常用的集成開(kāi)發(fā)環(huán)境 7
1.2.3 HTML5網(wǎng)頁(yè)的基本結(jié)構(gòu) 8
1.2.4 代碼注釋 11
項(xiàng)目小結(jié) 14
課后習(xí)題 14
項(xiàng)目2 搭建網(wǎng)頁(yè)基礎(chǔ)布局 15
任務(wù)2.1 創(chuàng)建CSS3樣式表 15
2.1.1 CSS概述 16
2.1.2 CSS樣式規(guī)則及引入方式 18
2.1.3 CSS基礎(chǔ)選擇器 23
2.1.4 CSS的特征 28
任務(wù)2.2 使用盒模型對(duì)網(wǎng)頁(yè)進(jìn)行基礎(chǔ)布局 36
2.2.1 盒模型基礎(chǔ) 37
2.2.2 盒模型的相關(guān)屬性 41
2.2.3 盒模型的內(nèi)減模式 55
2.2.4 背景樣式基礎(chǔ) 58
項(xiàng)目小結(jié) 72
課后習(xí)題 72
項(xiàng)目3 制作公司簡(jiǎn)介模塊 74
任務(wù)3.1 文字內(nèi)容的制作 74
3.1.1 文本相關(guān)的標(biāo)記 75
3.1.2 CSS字體及文本樣式 80
任務(wù)3.2 圖像內(nèi)容的制作 92
3.2.1 圖像標(biāo)記 93
3.2.2 元素顯示模式轉(zhuǎn)換 96
項(xiàng)目小結(jié) 102
課后習(xí)題 102
項(xiàng)目4 制作旅行故事模塊 104
任務(wù)4.1 元素的浮動(dòng) 104
4.1.1 浮動(dòng)屬性 105
4.1.2 清除浮動(dòng)的不良影響(盒子高度塌陷及其解決辦法) 110
任務(wù)4.2 元素的定位 117
4.2.1 定位的作用及分類 118
4.2.2 絕對(duì)定位與相對(duì)定位 120
4.2.3 固定定位的特點(diǎn)及應(yīng)用案例 122
4.2.4 元素的層疊等級(jí) 123
項(xiàng)目小結(jié) 130
課后習(xí)題 130
項(xiàng)目5 制作新聞中心模塊 132
任務(wù)5.1 列表的制作 132
5.1.1 列表標(biāo)記 133
5.1.2 列表樣式 136
項(xiàng)目小結(jié) 145
課后習(xí)題 146
項(xiàng)目6 制作導(dǎo)航模塊 147
任務(wù)6.1 超鏈接的制作 147
6.1.1 超鏈接標(biāo)記 148
6.1.2 CSS鏈接偽類選擇器 151
6.1.3 CSS屬性選擇器 152
任務(wù)6.2 列表嵌套 160
6.2.1 列表的嵌套 160
6.2.2 CSS關(guān)系選擇器 161
6.2.3 CSS偽類選擇器 164
項(xiàng)目小結(jié) 172
課后習(xí)題 172
項(xiàng)目7 制作宣傳視頻模塊 174
任務(wù)7.1 播放音頻和視頻 174
7.1.1 HTML5的音頻標(biāo)記 175
7.1.2 HTML5的視頻標(biāo)記 178
項(xiàng)目小結(jié) 185
課后習(xí)題 185
項(xiàng)目8 制作熱門推薦模塊 187
任務(wù)8.1 表格的制作 187
8.1.1 表格的相關(guān)標(biāo)記 188
8.1.2 表格的樣式設(shè)置 193
8.1.3 合并單元格 196
項(xiàng)目小結(jié) 200
課后習(xí)題 200
項(xiàng)目9 制作會(huì)員登錄頁(yè)面 202
任務(wù)9.1 表單的制作 202
9.1.1 表單的作用及構(gòu)成 203
9.1.2 input表單控件 206
項(xiàng)目小結(jié) 222
課后習(xí)題 222
項(xiàng)目10 制作新聞詳情頁(yè)面 223
任務(wù)10.1 HTML5新增標(biāo)記與屬性 223
10.1.1 新增文檔結(jié)構(gòu)化標(biāo)記 224
10.1.2 新增語(yǔ)義信息標(biāo)記 229
10.1.3 新增全局屬性 230
任務(wù)10.2 CSS3高級(jí)應(yīng)用 235
10.2.1 線性漸變 235
10.2.2 徑向漸變 236
10.2.3 文字漸變 239
項(xiàng)目小結(jié) 241
課后習(xí)題 242
項(xiàng)目11 制作頁(yè)面動(dòng)畫(huà)效果 243
任務(wù)11.1 過(guò)渡效果的實(shí)現(xiàn) 243
任務(wù)11.2 變形與動(dòng)畫(huà)效果的實(shí)現(xiàn) 252
11.2.1 CSS3的變形屬性 253
11.2.2 CSS3的動(dòng)畫(huà)屬性 262
項(xiàng)目小結(jié) 269
課后習(xí)題 270
?
項(xiàng)目12 制作響應(yīng)式頁(yè)面 271
任務(wù)12.1 頁(yè)面布局的新技術(shù) 271
12.1.1 響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì) 273
12.1.2 媒體查詢 274
12.1.3 彈性盒布局 283
項(xiàng)目小結(jié) 300
課后習(xí)題 300