Web前端開發(fā)實(shí)戰(zhàn)

單元1 Web前端開發(fā)先備知識 1
【任務(wù)1．1】揭秘Web前端開發(fā) 1
1．1．1 Web前端開發(fā)概述 1
1．1．2 Web標(biāo)準(zhǔn) 3
【任務(wù)1．2】使用前端工具開發(fā)第一個(gè)網(wǎng)頁 4
1．2．1 前端開發(fā)工具介紹 5
1．2．2 使用Dreamweaver CS6 5
1．2．3 使用Sublime Text 8
1．2．4 使用Dreamweaver CC 11
1．2．5 瀏覽器簡介 13
【任務(wù)1．3】建立正確的站點(diǎn)結(jié)構(gòu) 15
1．3．1 前端頁面相關(guān)知識 15
1．3．2 站點(diǎn)的建立 17
1．3．3 站點(diǎn)的管理和發(fā)布 20
單元測試1 22
單元2 構(gòu)建HTML頁面 23
【任務(wù)2．1】基本頁面構(gòu)建 23
2．1．1 HTML介紹 23
2．1．2 HTML5網(wǎng)頁的基本結(jié)構(gòu)和基本標(biāo)簽的作用 24
2．1．3 創(chuàng)建簡單網(wǎng)頁 25
2．1．4 HTML頭部屬性設(shè)置 28
【任務(wù)2．2】新聞頁面構(gòu)建 30
2．2．1 HTML基本標(biāo)簽 30
2．2．2 新聞頁面制作 35
2．2．3 自閉合標(biāo)簽 36
2．2．4 相對路徑和絕對路徑 37
【任務(wù)2．3】讀書頁面構(gòu)建 39
2．3．1 超鏈接 41
2．3．2 讀書頁面制作 42
2．3．3 HTML中的命名規(guī)則 43
2．3．4 超鏈接中的一些屬性 44
【任務(wù)2．4】教育頁面構(gòu)建 45
2．4．1 列表 47
2．4．2 教育頁面制作 49
【任務(wù)2．5】浪浪網(wǎng)首頁構(gòu)建 52
2．5．1 表格 54
2．5．2 表格語義化 57
2．5．3 浪浪網(wǎng)首頁制作 59
【任務(wù)2．6】浪浪網(wǎng)注冊頁面構(gòu)建 64
2．6．1 表單標(biāo)簽 65
2．6．2 表單元素 67
2．6．3 表單分組 73
2．6．4 注冊頁面制作 74
2．6．5 HTML5新增的表單標(biāo)簽 77
【任務(wù)2．7】浪浪網(wǎng)多媒體頁面構(gòu)建 79
2．7．1 多媒體的使用 80
2．7．2 多媒體頁面制作 83
單元測試2 84
單元3 使用CSS美化頁面 86
【任務(wù)3．1】初識浪浪網(wǎng)頭部CSS 86
3．1．1 初識CSS 86
3．1．2 浪浪網(wǎng)頭部CSS設(shè)置 91
3．1．3 Google推薦的HTML和CSS格式規(guī)范 92
【任務(wù)3．2】新聞頁面的簡單美化 96
3．2．1 文字樣式 97
3．2．2 文本樣式 100
3．2．3 超鏈接樣式 103
3．2．4 邊框樣式 105
3．2．5 背景樣式 108
3．2．6 新聞頁面的美化 112
3．2．7 字體設(shè)置 113
3．2．8 CSS3中新增的背景屬性和圓角邊框?qū)傩?115
【任務(wù)3．3】浪浪網(wǎng)首頁主體制作 119
3．3．1 CSS盒子模型和HTML元素 120
3．3．2 列表樣式 126
3．3．3 浮動布局 128
3．3．4 首頁主體制作 133
3．3．5 清除浮動的方法 143
【任務(wù)3．4】浪浪網(wǎng)導(dǎo)航欄制作 147
3．4．1 定位布局 147
3．4．2 z-index屬性 152
3．4．3 display屬性 154
3．4．4 導(dǎo)航欄制作 155
單元測試3 161
單元4 使用JavaScript制作網(wǎng)頁特效 163
【任務(wù)4．1】浪浪網(wǎng)下拉菜單特效制作 163
4．1．1 JavaScript簡介 164
4．1．2 在網(wǎng)頁中引入JavaScript的方式 165
4．1．3 JavaScript的數(shù)據(jù)結(jié)構(gòu) 166
4．1．4 JavaScript流程控制語句 168
4．1．5 函數(shù) 169
4．1．6 JavaScript常用事件 172
4．1．7 下拉菜單特效 173
【任務(wù)4．2】浪浪網(wǎng)圖片輪換特效制作 176
4．2．1 DOM模型 177
4．2．2 數(shù)組 180
4．2．3 定時(shí) 181
4．2．4 計(jì)時(shí) 183
4．2．5 圖片輪換特效 183
4．2．6 Date對象 185
【任務(wù)4．3】浪浪網(wǎng)表單驗(yàn)證特效制作 187
4．3．1 獲取表單元素值 187
4．3．2 JavaScript內(nèi)置函數(shù) 189
4．3．3 正則表達(dá)式 190
4．3．4 表單驗(yàn)證特效 192
4．3．5 HTML5的表單驗(yàn)證 195
4．3．6 自定義驗(yàn)證信息 196
【任務(wù)4．4】浪浪網(wǎng)其他特效制作 198
4．4．1 CSS樣式特效 200
4．4．2 window對象 201
4．4．3 選項(xiàng)卡特效 204
4．4．4 彈出廣告特效 206
4．4．5 頁面返回、前進(jìn)、刷新特效 206
單元測試4 208
單元5 綜合實(shí)戰(zhàn) 209
【任務(wù)5．1】水源安檢企業(yè)網(wǎng)站首頁制作 209
5．1．1 頁面布局 210
5．1．2 代碼實(shí)現(xiàn) 213
【任務(wù)5．2】萬維電商網(wǎng)站首頁制作 233
5．2．1 常見的網(wǎng)站類型 233
5．2．2 頁面布局 236
5．2．3 代碼實(shí)現(xiàn) 240
附錄A Dreamweaver CC使用技巧 257
附錄B 單元測試答案 260