網(wǎng)頁設(shè)計(jì)與制作

任務(wù)1　創(chuàng)建第一個網(wǎng)頁\t1
1．1　基本條件和概念\t3
1．1．1　學(xué)習(xí)工具\(yùn)t3
1．1．2　基本概念\t3
1．1．3　任務(wù)：建站點(diǎn)建網(wǎng)頁\t6
1．2　格式排版標(biāo)簽\t9
1．2．1　段落標(biāo)簽與換行標(biāo)簽\t9
1．2．2　標(biāo)題標(biāo)簽\t10
1．2．3　水平線標(biāo)簽\t10
1．2．4　無語義標(biāo)簽\t11
1．2．5　文本標(biāo)簽\t11
1．3　列表標(biāo)簽\t13
1．3．1　有序列表\t14
1．3．2　無序列表\t15
1．3．3　自定義列表\t17
1．3．4　嵌套列表\t18
1．4　圖像\t20
1．5　超鏈接\t24
1．5．1　超鏈接的屬性\t24
1．5．2　郵箱鏈接\t26
1．5．3　錨點(diǎn)鏈接\t27
1．6　表格\t28
1．7　任務(wù)實(shí)施\t32
任務(wù)2　用CSS美化你的網(wǎng)頁\t36
2．1　CSS概念\t37
2．2　CSS的使用方法\t37
2．3　CSS聲明與應(yīng)用\t39
2．3．1　CSS格式\t39
2．3．2　CSS注釋\t39
2．3．3　CSS單位\t39
2．3．4　CSS顏色\t39
2．3．5　選擇器\t40
2．4　CSS常見屬性\t48
2．4．1　CSS字體\t48
2．4．2　CSS文本\t56
2．4．3　CSS盒子模型\t66
2．4．4　CSS邊框\t72
2．4．5　CSS鏈接\t81
2．4．6　CSS列表\t83
2．4．7　CSS背景\t92
2．4．8　CSS浮動\t112
2．4．9　CSS定位\t124
2．5　任務(wù)實(shí)施\t129
任務(wù)3　規(guī)整網(wǎng)頁布局\t134
3．1　布局方式\t135
3．2　固定布局\t136
3．3　單列布局\t136
3．3．1　等寬單列布局\t136
3．3．2　非等寬單列布局\t139
3．4　兩列布局\t141
3．4．1　浮動方式實(shí)現(xiàn)兩列布局\t141
3．4．2　position實(shí)現(xiàn)兩列布局\t142
3．5　三列布局\t143
3．5．1　圣杯布局\t143
3．5．2　雙飛翼布局\t147
3．6　嵌套混合布局\t149
3．7　任務(wù)實(shí)施\t150
3．7．1　整體布局\t151
3．7．2　第二層布局\t153
3．7．3　第三層布局\t154
3．7．4　各模塊內(nèi)容設(shè)計(jì)\t155
任務(wù)4　通過表單與用戶交互\t164
4．1　認(rèn)識表單\t165
4．1．1　表單域\t166
4．1．2　表單元素\t168
4．1．3　HTML5新增表單類型與屬性\t172
4．1．4　表單驗(yàn)證\t177
4．2　任務(wù)實(shí)施\t179
任務(wù)5　應(yīng)用媒體標(biāo)簽制作個性化播放器\t189
5．1　HTML5音頻標(biāo)簽\t190
5．2　HTML5視頻標(biāo)簽\t192
5．3　HTML5音視頻標(biāo)簽使用中的“坑”\t193
5．4　音視頻標(biāo)簽的DOM操作\t194
5．5　任務(wù)實(shí)施\t198
任務(wù)6　制作活動抽獎大轉(zhuǎn)盤\t206
6．1　CSS坐標(biāo)系統(tǒng)與角度單位\t207
6．2　transform屬性\t209
6．3　transition屬性\t223
6．4　animation屬性\t228
6．5　@keyframes屬性\t230
6．6　任務(wù)實(shí)施\t233
任務(wù)7　純CSS實(shí)現(xiàn)瀑布流布局\t240
7．1　多列布局實(shí)現(xiàn)瀑布流網(wǎng)頁布局\t241
7．1．1　多列布局知識圖譜\t241
7．1．2　多列布局前導(dǎo)知識\t241
7．1．3　任務(wù)實(shí)施\t245
7．2　彈性布局實(shí)現(xiàn)瀑布流布局\t249
7．2．1　彈性布局知識圖譜\t249
7．2．2　彈性布局前導(dǎo)知識\t250
7．2．3　容器屬性\t251
7．2．4　項(xiàng)目屬性\t254
7．2．5　利用彈性布局設(shè)計(jì)微信底部導(dǎo)航欄\t257
7．2．6　任務(wù)實(shí)施\t264
7．3　網(wǎng)格布局實(shí)現(xiàn)瀑布流布局\t265
7．3．1　網(wǎng)格布局知識圖譜\t265
7．3．2　網(wǎng)格布局前導(dǎo)知識\t266
7．3．3　任務(wù)實(shí)施\t277
任務(wù)8　響應(yīng)式網(wǎng)頁開發(fā)\t280
8．1　前導(dǎo)知識\t281
8．1．1　設(shè)備屏幕\t281
8．1．2　關(guān)于視口\t284
8．1．3　媒體查詢技術(shù)\t287
8．1．4　響應(yīng)式圖片技術(shù)\t290
8．1．5　流式布局\t293
8．2　響應(yīng)式框架制作旅游網(wǎng)頁\t299
8．2．1　安裝Bootstrap\t300
8．2．2　組件\t302
8．2．3　布局\t308