網(wǎng)頁設(shè)計與制作（活頁式）

目　錄
第一篇　基礎(chǔ)篇
情境一　網(wǎng)頁設(shè)計與制作概述 3
【學(xué)習(xí)導(dǎo)航】 3
1　制作第一個網(wǎng)頁 3
2　職業(yè)技能與知識點要求 3
3　素質(zhì)目標 3
【學(xué)習(xí)環(huán)節(jié)】 3
1　學(xué)習(xí)路線 3
2　知識小天地 4
2.1　認識網(wǎng)頁 4
2.2　網(wǎng)頁概念 4
2.3　靜態(tài)網(wǎng)頁和動態(tài)網(wǎng)頁 5
2.4　Web服務(wù)器和客戶端 5
2.5　統(tǒng)一資源定位器（URL） 6
2.6　網(wǎng)頁制作的基本技術(shù) 6
2.7　常見網(wǎng)頁制作工具 7
【考核評價】 12
【同步技能考點測試】 12
【課后拓展】 12
情境二　制作純文本網(wǎng)頁 13
【學(xué)習(xí)導(dǎo)航】 13
1　制作革命根據(jù)地網(wǎng)頁 13
2　職業(yè)技能與知識點要求 13
3　素質(zhì)目標 13
【學(xué)習(xí)環(huán)節(jié)】 13
1　學(xué)習(xí)路線 13
2　知識小天地 14
2.1　HTML發(fā)展歷程 14
2.2　HTML特點 14
2.3　＜!DOCTYPE＞標記 15
2.4?。糷tml＞＜/html＞標記 15
2.5?。糷ead＞＜/head＞標記 15
2.6?。糾eta /＞標記—設(shè)置編碼格式 15
2.7　＜meta /＞標記—設(shè)置網(wǎng)頁描述 15
2.8?。糾eta /＞標記—設(shè)置作者信息 16
2.9?。糾eta /＞標記—設(shè)置頁面自動刷新和跳轉(zhuǎn) 16
2.10?。紅itle＞＜/title＞標記 16
2.11　＜link /＞標記 16
2.12?。約cript＞＜/script＞標記 17
2.13　＜body＞＜/body＞標記 17
2.14?。糷n＞＜/hn＞標題標記 17
2.15?。紁＞＜/p＞段落標記 18
2.16　＜hr /＞水平線標記 19
2.17?。糱r /＞換行標記 19
2.18　＜font＞＜/font＞字體標記 20
2.19　字體樣式標記 21
【考核評價】 24
【同步技能考點測試】 25
【課后拓展】 25
情境三　制作圖文混排網(wǎng)頁 26
【學(xué)習(xí)導(dǎo)航】 26
1　制作中國古代科技文化成就介紹網(wǎng)頁 26
2　職業(yè)技能與知識點要求 26
3　素質(zhì)目標 26
【學(xué)習(xí)環(huán)節(jié)】 26
1　學(xué)習(xí)路線 26
2　知識小天地 27
2.1　無序列表 27
2.2　有序列表 28
2.3　自定義列表 29
2.4　常用圖片格式 30
2.5?。糹mg＞圖片標記 31
2.6　圖片路徑的表示方法 33
【考核評價】 39
【同步技能考點測試】 40
【課后拓展】 40

情境四　制作表格布局的網(wǎng)頁 41
【學(xué)習(xí)導(dǎo)航】 41
1　制作歷史人物故事網(wǎng)頁 41
2　職業(yè)技能與知識點要求 41
3　素質(zhì)目標 41
【學(xué)習(xí)環(huán)節(jié)】 41
1　學(xué)習(xí)路線 41
2　知識小天地 42
2.1　表格標記 42
2.2　合并單元格 45
【考核評價】 51
【同步技能考點測試】 52
【課后拓展】 52
情境五　制作包含超鏈接的網(wǎng)頁 53
【學(xué)習(xí)導(dǎo)航】 53
1　綠水青山網(wǎng)站的設(shè)計與制作 53
2　職業(yè)技能與知識點要求 53
3　素質(zhì)目標 53
【學(xué)習(xí)環(huán)節(jié)】 54
1　學(xué)習(xí)路線 54
2　學(xué)習(xí)小天地 54
2.1　超鏈接的定義 54
2.2　超鏈接的分類 54
2.3　文本超鏈接 54
2.4　圖像超鏈接 55
2.5　錨點超鏈接 57
【考核評價】 65
【同步技能考點測試】 65
【課后拓展】 65
第二篇　進階篇
情境六　使用模板制作網(wǎng)頁 69
【學(xué)習(xí)導(dǎo)航】 69
1　書籍網(wǎng)頁的設(shè)計與制作 69
2　職業(yè)技能與知識點要求 69
3　素質(zhì)目標 69
【學(xué)習(xí)環(huán)節(jié)】 69
1　學(xué)習(xí)路線 69
2　知識小天地 70
2.1　新建模板 70
2.2　管理模板 72
【考核評價】 78
【同步技能考點測試】 78
【課后拓展】 78
情境七　制作注冊網(wǎng)頁 79
【學(xué)習(xí)導(dǎo)航】 79
1　個人信息注冊網(wǎng)頁制作 79
2　職業(yè)技能與知識點要求 79
3　素質(zhì)目標 79
【學(xué)習(xí)環(huán)節(jié)】 79
1　學(xué)習(xí)路線 79
2　知識小天地 80
2.1　表單的作用 80
2.2　表單標記 80
【考核評價】 88
【同步技能考點測試】 89
【課后拓展】 89
情境八　使用CSS美化網(wǎng)頁 90
【學(xué)習(xí)導(dǎo)航】 90
1　中國航天成就網(wǎng)頁的設(shè)計與制作 90
2　職業(yè)技能與知識點要求 90
3　素質(zhì)目標 90
【學(xué)習(xí)環(huán)節(jié)】 91
1　學(xué)習(xí)路線 91
2　知識小天地 91
2.1　什么是CSS 91
2.2　CSS的引入方式 91
2.3　CSS的兩個特性 92
2.4　CSS的基本語法 93
2.5　CSS選擇器的分類 93
2.6　CSS的屬性 98
【考核評價】 121
【同步技能考點測試】 121
【課后拓展】 121
情境九　使用JavaScript制作交互式注冊頁面 122
【學(xué)習(xí)導(dǎo)航】 122
1　交互式注冊頁面的設(shè)計與制作 122
2　職業(yè)技能與知識點要求 122
3　素質(zhì)目標 122
【學(xué)習(xí)環(huán)節(jié)】 122
1　學(xué)習(xí)路線 122
2　知識小天地 123
2.1　JavaScript的組成 123
2.2　JavaScript的引用 124
2.3　JavaScript的語法 124
2.4　JavaScript的關(guān)鍵字 125
2.5　JavaScript的變量、數(shù)據(jù)類型和聲明 125
2.6　JavaScript的標識符 125
2.7　JavaScript的全局屬性 126
2.8　JavaScript的運算符 126
2.9　JavaScript的分支循環(huán) 128
2.10　JavaScript的數(shù)組 130
2.11　JavaScript的字符串 132
2.12　JavaScript的正則表達式 133
2.13　JavaScript的函數(shù) 136
2.14　BOM對象 137
2.15　DOM對象 140
2.16　JavaScript的事件 142
【考核評價】 149
【同步技能考點測試】 150
【課后拓展】 150
第三篇　應(yīng)用篇
情境十　綜合網(wǎng)站規(guī)劃與設(shè)計 153
【學(xué)習(xí)導(dǎo)航】 153
1　學(xué)習(xí)網(wǎng)站的規(guī)劃與設(shè)計 153
2　職業(yè)技能與知識點要求 153
3　素質(zhì)目標 153
【學(xué)習(xí)環(huán)節(jié)】 153
1　學(xué)習(xí)路線 153
2　知識小天地 154
2.1　網(wǎng)站設(shè)計與制作流程 154
2.2　定位網(wǎng)站主題 154
2.3　收集網(wǎng)站素材 155
2.4　設(shè)計網(wǎng)站導(dǎo)航菜單 155
2.5　設(shè)計網(wǎng)站LOGO 155
2.6　設(shè)計網(wǎng)站布局和風(fēng)格 156
【考核評價】 161
【同步技能考點測試】 162
【課后拓展】 162
情境十一　綜合網(wǎng)站的實現(xiàn)、測試與發(fā)布 163
【學(xué)習(xí)導(dǎo)航】 163
1　學(xué)習(xí)網(wǎng)站的實現(xiàn)、測試與發(fā)布 163
2　職業(yè)技能與知識點要求 163
3　素質(zhì)目標 163
【學(xué)習(xí)環(huán)節(jié)】 163
1　學(xué)習(xí)路線 163
2　知識小天地 164
2.1　文件命名規(guī)范 164
2.2　HTML規(guī)范 165
2.3　CSS代碼規(guī)范 165
2.4　JavaScript代碼規(guī)范 165
2.5　在網(wǎng)頁中插入視頻 165
2.6　網(wǎng)站的測試 166
2.7　網(wǎng)站的發(fā)布 167
【考核評價】 174
【同步技能考點測試】 174
【課后拓展】 175