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

網(wǎng)頁(yè)設(shè)計(jì)與制作教程第1章網(wǎng)頁(yè)制作基礎(chǔ)知識(shí)1
1.1網(wǎng)絡(luò)基礎(chǔ)知識(shí)1
1.1.1Internet簡(jiǎn)介1
1.1.2WWW簡(jiǎn)介2
1.1.3瀏覽器3
1.1.4IP地址3
1.1.5域名4
1.1.6HTTP協(xié)議6
1.1.7URL6
1.2網(wǎng)頁(yè)與網(wǎng)站的基礎(chǔ)知識(shí)7
1.2.1網(wǎng)頁(yè)、網(wǎng)頁(yè)文件和網(wǎng)站7
1.2.2靜態(tài)網(wǎng)頁(yè)和動(dòng)態(tài)網(wǎng)頁(yè)8
1.2.3網(wǎng)頁(yè)界面的構(gòu)成8
1.3網(wǎng)站制作常用軟件10
1.3.1網(wǎng)頁(yè)制作工具10
1.3.2美化網(wǎng)頁(yè)的基本工具11
1.4網(wǎng)頁(yè)編程語(yǔ)言12
1.5網(wǎng)站建設(shè)的基本流程13
第2章了解HTML、CSS、JavaScript15
2.1認(rèn)識(shí)HTML、CSS、JavaScript代碼15
2.1.1HTML代碼片段15
2.1.2CSS代碼片段16
2.1.3JavaScript代碼片段17
2.2HTML、CSS、JavaScript的作用17
2.2.1HTML在網(wǎng)頁(yè)中的作用18
2.2.2CSS在網(wǎng)頁(yè)中的作用18
2.2.3JavaScript在網(wǎng)頁(yè)中的作用19網(wǎng)頁(yè)設(shè)計(jì)與制作教程目錄2.3如何學(xué)習(xí)HTML、CSS、JavaScript代碼20
2.3.1先了解HTML、CSS、JavaScript的語(yǔ)法結(jié)構(gòu)20
2.3.2借助Dreamweaver學(xué)習(xí)20
2.4HTML、CSS、JavaScript的綜合應(yīng)用22
第3章HTML基礎(chǔ)知識(shí)25
3.1HTML基本語(yǔ)法概念25
3.1.1HTML標(biāo)簽語(yǔ)法25
3.1.2HTML標(biāo)簽屬性26
3.1.3HTML文件的命名26
3.1.4編寫HTML文件的注意事項(xiàng)27
3.2HTML文件頭部?jī)?nèi)容27
3.2.1設(shè)置頁(yè)面標(biāo)題27
3.2.2設(shè)置基底網(wǎng)址28
3.2.3設(shè)置頁(yè)面元信息29
3.3HTML文件主體內(nèi)容31
3.3.1設(shè)置頁(yè)面背景31
3.3.2設(shè)置頁(yè)面邊距33
3.3.3設(shè)置文本顏色34
3.4文字與段落34
3.4.1換行35
3.4.2添加注釋35
3.4.3段落36
3.4.4添加特殊字符37
3.4.5預(yù)格式化38
3.4.6設(shè)置段落縮進(jìn)39
3.4.7插入并設(shè)置水平線40
3.5建立和使用列表42
3.5.1列表類型42
3.5.2插入有序列表42
3.5.3插入無(wú)序列表44
3.5.4列表的嵌套46
3.6超鏈接的建立47
3.6.1插入內(nèi)部鏈接49
3.6.2插入外部鏈接50
3.7插入圖片52
3.7.1插入圖像標(biāo)簽52
3.7.2圖像提示文字53
3.7.3設(shè)置圖片的寬度和高度54
3.7.4設(shè)置圖像對(duì)齊方式55
3.7.5設(shè)置圖像與文本之間的距離56
3.8綜合應(yīng)用實(shí)例57
第4章HTML表格的應(yīng)用66
4.1表格的概述66
4.1.1設(shè)置基本表格結(jié)構(gòu)66
4.1.2設(shè)置表格標(biāo)題67
4.1.3設(shè)置表格表頭68
4.2設(shè)置表格標(biāo)簽屬性70
4.2.1設(shè)置表格的寬度71
4.2.2設(shè)置行的高度72
4.2.3設(shè)置表格的邊框?qū)傩?3
4.2.4設(shè)置邊框的樣式74
4.3設(shè)置表格行與單元格76
4.3.1調(diào)整行內(nèi)容水平對(duì)齊76
4.3.2調(diào)整行內(nèi)容垂直對(duì)齊78
4.3.3設(shè)置跨行80
4.3.4設(shè)置跨列81
4.3.5設(shè)置單元格間距82
4.3.6設(shè)置單元格邊距84
4.4表格嵌套86
4.5綜合應(yīng)用實(shí)例88
第5章框架的應(yīng)用90
5.1框架的概述90
5.2框架的基本結(jié)構(gòu)91
5.3設(shè)置框架91
5.3.1設(shè)置框架源文件屬性91
5.3.2添加框架名稱92
5.3.3設(shè)置框架邊框93
5.3.4顯示框架滾動(dòng)條94
5.3.5設(shè)置框架尺寸為不可調(diào)整95
5.3.6設(shè)置框架邊緣寬度與高度96
5.4設(shè)置框架集97
5.4.1左右分隔窗口98
5.4.2上下分隔窗口99
5.4.3橫縱分隔窗口100
5.4.4縱橫分隔窗口101
5.5浮動(dòng)框架102
5.5.1設(shè)置浮動(dòng)框架源文件屬性102
5.5.2設(shè)置浮動(dòng)框架名稱103
5.5.3設(shè)置浮動(dòng)框架寬度和高度104
5.6在框架上建立鏈接105
5.6.1普通框架添加鏈接105
5.6.2浮動(dòng)框架添加鏈接106
5.7框架的實(shí)際應(yīng)用107
第6章表單的應(yīng)用110
6.1表單概述110
6.2表單標(biāo)簽111
6.3信息輸入111
6.3.1插入文本框112
6.3.2插入密碼框112
6.3.3插入復(fù)選框113
6.3.4插入單選按鈕115
6.3.5插入文件域116
6.3.6插入圖像域117
6.3.7插入提交按鈕118
6.3.8插入重置按鈕119
6.3.9插入標(biāo)準(zhǔn)按鈕120
6.3.10插入隱藏域121
6.4插入文本區(qū)域122
6.5插入下拉菜單和列表項(xiàng)123
6.6綜合應(yīng)用實(shí)例125
第7章CSS基礎(chǔ)知識(shí)127
7.1CSS概述127
7.1.1CSS的基本概念127
7.1.2CSS的特點(diǎn)127
7.1.3CSS規(guī)范128
7.2CSS與HTML文檔的結(jié)合方法129
7.2.1定義內(nèi)部樣式表129
7.2.2定義行內(nèi)樣式130
7.2.3鏈入外部樣式表131
7.2.4導(dǎo)入外部樣式表133
7.3CSS常用選擇符134
7.3.1類型選擇符134
7.3.2class類選擇符134
7.3.3id選擇符136
7.3.4通用選擇符138
7.3.5包含選擇符139
7.3.6分組選擇符140
7.3.7偽類選擇符140
7.4CSS設(shè)置文字的樣式142
7.4.1設(shè)置文字的字體142
7.4.2設(shè)置字體的大小143
7.4.3設(shè)置字體的粗細(xì)144
7.4.4設(shè)置字體的傾斜145
7.4.5設(shè)置字體的修飾146
7.4.6設(shè)置字體的陰影147
7.5CSS設(shè)置段落格式148
7.5.1設(shè)置文字的對(duì)齊方式148
7.5.2設(shè)置首行縮進(jìn)149
7.5.3設(shè)置行高150
7.6CSS設(shè)置網(wǎng)頁(yè)背景151
7.6.1設(shè)置背景顏色151
7.6.2設(shè)置背景圖像152
7.7div+CSS布局方法154
7.7.1div標(biāo)簽154
7.7.2CSS盒模型155
7.7.3盒模型的寬度與高度157
7.8CSS的定位158
7.8.1靜態(tài)定位158
7.8.2相對(duì)定位161
7.8.3絕對(duì)定位162
7.8.4固定定位163
7.9浮動(dòng)與清除浮動(dòng)164
7.9.1浮動(dòng)164
7.9.2清除浮動(dòng)166
7.10綜合應(yīng)用實(shí)例169
7.10.1前期準(zhǔn)備170
7.10.2制作頁(yè)面170第8章JavaScript基礎(chǔ)知識(shí)174
8.1JavaScript語(yǔ)言概述174
8.1.1JavaScript語(yǔ)言的特點(diǎn)174
8.1.2在網(wǎng)頁(yè)中加入JavaScript174
8.1.3JavaScript常用元素175
8.1.4簡(jiǎn)單的腳本程序176
8.2JavaScript基本數(shù)據(jù)結(jié)構(gòu)178
8.2.1JavaScript基本數(shù)據(jù)類型178
8.2.2JavaScript表達(dá)式和運(yùn)算符179
8.3JavaScript控制語(yǔ)句180
8.3.1if語(yǔ)句180
8.3.2for語(yǔ)句181
8.3.3switch語(yǔ)句182
8.3.4while與do…while語(yǔ)句184
8.4函數(shù)186
8.4.1有參函數(shù)調(diào)用187
8.4.2無(wú)參函數(shù)調(diào)用188
8.5對(duì)象的基本知識(shí)189
8.5.1用于操作對(duì)象的語(yǔ)句、關(guān)鍵詞及運(yùn)算符189
8.5.2對(duì)象屬性的引用190
8.5.3對(duì)象方法的引用192
8.5.4瀏覽器內(nèi)部對(duì)象193
8.5.5內(nèi)置對(duì)象和方法201
8.6事件概念202
8.6.1鼠標(biāo)單擊事件onClick202
8.6.2文本框或列表框內(nèi)容改變事件onChange203
8.6.3內(nèi)容選中事件onSelect205
8.6.4聚焦事件onFocus206
8.6.5加載事件onLoad208
8.6.6卸載事件onUnload209
8.6.7失焦事件onBlur210
8.6.8鼠標(biāo)移入事件onMouseOver211
8.6.9鼠標(biāo)移開事件onMouseOut211
8.6.10其他常用事件212
8.7綜合應(yīng)用實(shí)例213