精通Web標準網(wǎng)頁布局：XHTML+CSS+JavaScript

第一篇　XHTML
第1章　XHTML簡介　3
1.1　為什么要建立XHTML　3
1.2　什么是XHTML　4
1.3　HTML和XHTML　4
1.4　XML和XHTML　5
1.5　一個簡單的XHTML示例　5
1.6　XHTML與瀏覽器　6
1.7　XHTML的開發(fā)軟件和運行環(huán)境　7
第2章　XHTML基礎(chǔ)　11
2.1　XHTML頁面結(jié)構(gòu)　11
2.2　元素的書寫格式和屬性　13
2.2.1　元素的書寫格式　13
2.2.2　元素的屬性　14
2.3　XHTML語法規(guī)范　15
2.4　選擇文檔類型　18
2.4.1　什么是文檔類型　18
2.4.2　選擇什么樣的DOCTYPE　18
2.5　名字空間　19
第3章　 html 元素和頁面頭部　21
3.1　頁面基礎(chǔ)元素 html 　21
3.1.1　文本顯示方向?qū)傩詃ir　22
3.1.2　指定語言屬性lang　23
3.2　頁面頭部元素 head 　24
3.3　頁面標題元素 title 　24
3.4　基本設(shè)置元素 base 　25
3.5　元信息元素 meta 　27
3.5.1　元信息元素名稱屬性name　28
3.5.2　元信息元素的值content　28
3.5.3　元信息元素的附加屬性http-equiv　28
3.5.4　定義頁面的文字編碼　29
3.5.5　定義頁面的關(guān)鍵字　30
3.5.6　定義頁面的主要內(nèi)容　31
3.5.7　定義頁面的搜索方式　31
3.5.8　定義頁面的版權(quán)信息　32
3.5.9　定義頁面的作者信息　33
3.5.10　定義頁面的刷新時間　33
3.5.11　定義頁面的跳轉(zhuǎn)　33
3.6　創(chuàng)建樣式元素 style 　34
3.6.1　類型屬性type　35
3.6.2　類型屬性media　36
3.7　鏈接元素 link 　37
3.7.1　指定鏈接路徑屬性href　38
3.7.2　鏈接的類型屬性type　38
3.7.3　源文檔與目標文檔關(guān)系屬性rel、rev　39
3.7.4　鏈接樣式文件　40
3.7.5　制作收藏夾圖標　41
3.8　腳本元素 script 　42
3.8.1　腳本的語言屬性language　43
3.8.2　腳本的類型屬性type　44
3.8.3　推遲執(zhí)行屬性defer　44
3.8.4　腳本的鏈接屬性src　45
第4章　頁面主體元素　47
4.1　頁面主體元素 body 　47
4.2　頁面主體元素的背景和文本屬性　48
4.2.1　主體元素的背景屬性bgcolor　49
4.2.2　主體元素的背景圖片屬性background　50
4.2.3　主體元素的背景圖片滾動屬性bgproperties　51
4.2.4　主體元素的文本屬性text　53
4.3　頁面主體元素的邊界屬性　54
4.3.1　IE瀏覽器中的左邊界屬性leftmargin　54
4.3.2　IE瀏覽器中的上邊界屬性topmargin　55
4.4　頁面主體元素的鏈接屬性　56
4.4.1　未訪問過的鏈接屬性link　56
4.4.2　已訪問過的鏈接屬性vlink　57
4.4.3　激活的鏈接屬性alink　58
4.5　頁面主體元素的樣式屬性　59
4.5.1　主體元素中使用樣式屬性style　59
4.5.2　主體元素中調(diào)用樣式屬性class　60
4.6　背景音樂的使用　61
4.6.1　IE瀏覽器中添加背景音樂元素 bgsound 　61
4.6.2　背景音樂的路徑屬性src　62
4.6.3　背景音樂的重復屬性loop　63
第5章　文本元素　65
5.1　文本元素簡介　65
5.2　區(qū)域元素 div 　65
5.2.1　區(qū)域元素的對齊屬性align　66
5.2.2　調(diào)用樣式屬性class　68
5.2.3　創(chuàng)建樣式屬性style　69
5.2.4　標記屬性id　70
5.2.5　取消自動換行屬性nowrap　71
5.2.6　標題屬性title　71
5.3　段落元素 p 　72
5.4　標題元素　73
5.5　基于內(nèi)容的文本元素　75
5.5.1　強調(diào)元素 em 　76
5.5.2　加粗的強調(diào)元素 strong 　77
5.5.3　文獻參考元素 cite 　77
5.5.4　等寬元素 code 　78
5.5.5　變量顯示元素 var 　79
5.5.6　提取元素 samp 　79
5.5.7　鍵入文本元素 kbd 　80
5.5.8　術(shù)語元素 dfn 　81
5.5.9　縮寫元素 abbr 　81
5.5.10　首字母縮寫元素 acronym 　81
5.6　基于物理樣式的文本元素　81
5.6.1　加粗元素 b 　82
5.6.2　放大元素 big 　83
5.6.3　縮小元素 small 　83
5.6.4　斜體顯示元素 i 　84
5.6.5　下標元素 sub 　85
5.6.6　上標元素 sup 　86
5.6.7　等寬元素 tt 　87
5.7　文本的間隔和布局　88
5.7.1　換行元素 br 　88
5.7.2　 br 元素的清除屬性clear　88
5.7.3　取消換行元素 nobr 　89
5.7.4　保留格式元素 pre 　90
5.7.5　縮進元素 blockquote 　92
5.7.6　引用元素 q 　93
5.7.7　地址元素 address 　94
5.8　水平分隔線元素 hr 　95
5.8.1　水平分隔線的厚度屬性size　96
5.8.2　水平分隔線的樣式屬性noshade　97
5.8.3　水平分隔線的寬度屬性width　97
5.8.4　水平分隔線的對齊屬性align　98
5.8.5　水平分隔線的顏色屬性color　99
第6章　圖像元素　101
6.1　圖像的格式　101
6.1.1　JPEG格式　101
6.1.2　GIF格式　102
6.2　圖像元素 img 　102
6.2.1　圖像元素的路徑屬性src　104
6.2.2　代替圖片的文本屬性alt　104
6.2.3　圖像元素的寬度屬性width　106
6.2.4　圖像元素的高度屬性height　106
6.2.5　圖像元素的邊框?qū)傩詁order　108
6.2.6　代替圖片的長文本屬性longdesc　109
6.2.7　圖像元素的對齊屬性align　109
6.2.8　圖像元素的左右邊距屬性hspace　116
6.2.9　圖像元素的上下邊距屬性vspace　117
6.2.10　圖像服務(wù)器端映射屬性ismap　118
6.2.11　圖像服務(wù)器端映射屬性usemap　118
第7章　表格元素　119
7.1　表格元素的基本構(gòu)成　119
7.1.1　表格元素 table 　120
7.1.2　行元素 tr 　121
7.1.3　單元格元素 td 　122
7.2　 table 元素的屬性　124
7.2.1　邊框?qū)傩詁order　124
7.2.2　寬度屬性width　125
7.2.3　高度屬性height　126
7.2.4　水平對齊屬性align　127
7.2.5　背景顏色屬性bgcolor　128
7.2.6　背景圖片屬性background　129
7.2.7　邊框顏色屬性bordercolor　130
7.2.8　邊框暗邊線屬性bordercolordark　131
7.2.9　邊框亮邊線屬性bordercolorlight　132
7.2.10　同時使用bordercolordark屬性和bordercolorlight屬性　133
7.2.11　單元格間距屬性cellspacing　135
7.2.12　單元格補白屬性cellspadding　136
7.2.13　制作邊框為1像素的表格　138
7.2.14　表格單元格邊框?qū)傩詒ules　139
7.2.15　表格邊框?qū)傩詅rame　139
7.3　 tr 元素的屬性　141
7.3.1　水平對齊屬性align　141
7.3.2　垂直對齊屬性valign　142
7.3.3　背景顏色屬性bgcolor　143
7.3.4　邊框顏色屬性bordercolor　145
7.3.5　邊框暗邊線屬性bordercolordark　146
7.3.6　邊框亮邊線屬性bordercolorlight　147
7.4　 td 元素的屬性　148
7.4.1　水平對齊屬性align　148
7.4.2　垂直對齊屬性valign　150
7.4.3　背景顏色屬性bgcolor　151
7.4.4　背景圖片屬性background　152
7.4.5　寬度屬性width　153
7.4.6　高度屬性height　157
7.4.7　邊框?qū)傩詁ordercolor　160
7.4.8　合并列屬性colspan　161
7.4.9　合并行屬性rowspan　164
7.4.10　同時使用colspan屬性和rowspan屬性制作復雜表格　166
7.4.11　同行顯示屬性nowrap　170
7.5　表格中使用的其他元素　173
7.5.1　表格標題元素 caption 　173
7.5.2　表格頭部元素 th 　175
7.5.3　表格頭行元素 thead 　176
7.5.4　表主體元素 tbody 　178
7.5.5　表格行尾元素 tfoot 　179
7.6　表格中的列組　181
7.6.1　表格的列組元素 colgroup 　181
7.6.2　表格的列組元素的合并屬性span　182
7.6.3　列組的列元素 col 　183
7.6.4　使用列組元素　185
第8章　鏈接元素　187
8.1　 鏈接和路徑　187
8.1.1　超鏈接的概念　187
8.1.2　路徑url　188
8.1.3　相對路徑　189
8.1.4　絕對路徑　191
8.2　路徑的分類　192
8.2.1　HTTP路徑　192
8.2.2　FTP路徑　193
8.2.3　郵件路徑　194
8.3　鏈接元素 a 　195
8.3.1　指定路徑屬性href　197
8.3.2　顯示鏈接目標屬性target　197
8.3.3　鏈接的熱鍵屬性accesskey　199
8.3.4　激活順序?qū)傩詔abindex　200
8.3.5　定義當前文檔中的鏈接　201
8.4　圖像中的鏈接　204
8.4.1　為圖像元素制作鏈接　204
8.4.2　制作圖片局部鏈接的原理　205
8.4.3　創(chuàng)建鏈接區(qū)域元素 map 　205
8.4.4　鏈接區(qū)域的名稱屬性name　206
8.4.5　定義鼠標敏感區(qū)元素 area 　206
8.4.6　鏈接的路徑屬性href、nohref　208
8.4.7　鏈接的文本說明屬性alt　208
8.4.8　鼠標敏感區(qū)坐標屬性coords　209
8.4.9　鼠標敏感區(qū)形狀屬性shape　211
8.4.10　使用圖片中的鏈接　211
第9章　列表元素　213
9.1　列表元素的分類　213
9.2　無序列表元素 ul 　213
9.2.1　項目符號的類型屬性type　215
9.2.2　無序列表的嵌套　216
9.3　有序列表元素 ol 　217
9.3.1　項目符號的類型屬性type　219
9.3.2　有序列表的起始值屬性start　220
9.3.3　有序列表的嵌套　221
9.4　列表條目元素 li 　223
9.4.1　項目符號的類型屬性type　223
9.4.2　條目編號屬性value　224
9.5　定義列表元素 dl 　225
9.5.1　定義列表術(shù)語元素 dt 　227
9.5.2　定義列表條說明元素 dd 　228
9.5.3　定義列表的嵌套　229
9.6　混合嵌套列表元素　230
9.7　取消列表元素的項目符號　232
第10章　表單元素　235
10.1　表單元素概述　235
10.2　表單元素 form 　236
10.2.1　動作(action)屬性　238
10.2.2　發(fā)送數(shù)據(jù)方式(method)屬性　239
10.2.3　表單名稱(name)屬性　241
10.2.4　表單編碼(enctype)屬性　242
10.3　表單控件元素 input 　242
10.3.1　文本域(text)　244
10.3.2　密碼(password)區(qū)域　245
10.3.3　提交(submit)按鈕　246
10.3.4　復位(reset)按鈕　247
10.3.5　圖像(image)按鈕　248
10.3.6　單擊(button)按鈕　249
10.3.7　復選框(checkbox)　250
10.3.8　單選(radio)按鈕　251
10.3.9　隱藏(hidden)區(qū)域　252
10.4　 input 元素的屬性　253
10.4.1　只讀(readonly)屬性　253
10.4.2　不可用(disabled)屬性　254
10.5　選擇列表元素 select 　255
10.5.1　高度(size)屬性　256
10.5.2　多項(multiple)選擇屬性　257
10.5.3　 select 元素的寬度　258
10.6　選擇列表條目元素 option 　260
10.7　按鈕元素 button 　261
10.8　文本區(qū)域元素 textarea 　263
10.8.1　寬度(cols)屬性　265
10.8.2　高度(rows)屬性　265
10.9　表單標記元素 label 　266
10.9.1　定義目標屬性for　267
10.9.2　定義熱鍵(accesskey)屬性　268
第11章　多媒體元素　271
11.1　嵌入對象元素 object 　271
11.1.1　控件標記屬性classid　273
11.1.2　基本路徑屬性codebase　273
11.1.3　下載信息說明屬性standby　273
11.2　初始值元素 param 　273
11.2.1　名稱屬性name　275
11.2.2　值屬性value　276
11.3　嵌入文檔元素 embed 　276
11.4　頁面中使用多媒體　277
11.4.1　使用音頻文件　277
11.4.2　使用視頻文件　278
第12章　框架元素　281
12.1　框架元素概述　281
12.2　框架集元素 frameset 　282
12.2.1　框架集元素的行屬性rows　284
12.2.2　框架集元素的列屬性cols　287
12.2.3　混合使用行和列屬性　290
12.2.4　框架集元素的邊框?qū)傩詅rameborder　292
12.2.5　框架集元素的邊框?qū)挾葘傩詅ramespacing　293
12.2.6　框架集元素的邊框?qū)挾葘傩詁order　294
12.2.7　框架集元素的邊框顏色屬性bordercolor　297
12.2.8　框架集元素的嵌套　298
12.3　框架內(nèi)容元素 frame 　299
12.3.1　顯示內(nèi)容的路徑屬性src　300
12.3.2　滾動條屬性scrolling　301
12.3.3　固定尺寸屬性noresize　302
12.3.4　內(nèi)容的顯示位置屬性marginheight、marginwidth　304
12.3.5　邊框?qū)傩詅rameborder　307
12.4　不支持框架元素 noframes 　309
12.5　內(nèi)聯(lián)框架元素 iframe 　310
12.6　框架元素中的鏈接　312
第二篇　疊層樣式表(CSS)
第13章　疊層樣式表基礎(chǔ)　317
13.1　疊層樣式表概述　317
13.2　疊層樣式表的語法　318
13.3　選擇符　320
13.3.1　通配選擇符　321
13.3.2　類型選擇符　322
13.3.3　ID選擇符　324
13.3.4　類選擇符　325
13.3.5　包含選擇符　326
13.3.6　選擇符分組　327
13.4　屬性　328
13.5　值　329
13.5.1　顏色值　330
13.5.2　長度值　331
13.5.3　百分比值　334
13.6　偽類　335
13.7　繼承性　336
13.8　默認值　337
13.9　塊元素　337
13.10　內(nèi)聯(lián)元素　338
13.11　使用級聯(lián)樣式表的方法　339
13.11.1　元素中直接添加樣式　339
13.11.2　從頁面頭部 style 元素中調(diào)用　340
13.11.3　采用鏈接的形式調(diào)用　341
13.12　級聯(lián)樣式表的優(yōu)先級　344
13.12.1　使用樣式的優(yōu)先級　344
13.12.2　類型選擇符和類選擇符　345
13.12.3　ID選擇符和類選擇符　346
13.12.4　最近最優(yōu)先原則　347
13.12.5　同一個屬性幾個值的情況　349
第14章　級聯(lián)樣式的屬性　351
14.1　字體屬性　351
14.1.1　字體的選擇屬性font-family　351
14.1.2　字體的大小屬性font-size　352
14.1.3　字體的顏色屬性color　354
14.1.4　字體的樣式屬性font-style　356
14.1.5　字體的加粗屬性font-weight　357
14.1.6　字體的修飾屬性text-decoration　360
14.1.7　文本的轉(zhuǎn)換屬性text-transform　362
14.1.8　英文小型大寫字母轉(zhuǎn)換屬性font-variant　363
14.1.9　單詞間隔屬性word-spacing　365
14.1.10　字母間隔屬性letter-spacing　366
14.1.11　行高屬性line-height　367
14.1.12　字體的綜合屬性font　370
14.2　內(nèi)聯(lián)區(qū)域元素 span 　371
14.3　文本屬性　372
14.3.1　文本的水平對齊屬性text-align　372
14.3.2　文本的垂直對齊屬性vertical-align　374
14.3.3　文本的縮進屬性text-indent　375
14.3.4　文本的排版屬性layout-flow　378
14.3.5　文本的書寫方向?qū)傩詗riting-mode　379
14.3.6　文本流的方向?qū)傩詃irection　381
14.3.7　文本流的方向附加屬性unicode-bidi　382
14.3.8　文本換行屬性word-break　384
14.3.9　文本空白屬性white-space　385
14.4　背景屬性　386
14.4.1　背景顏色屬性background-color　387
14.4.2　背景圖片屬性background-image　388
14.4.3　背景圖片重復屬性background-repeat　389
14.4.4　背景圖片位置屬性background-position　390
14.4.5　背景圖片的附件屬性background-attachment　393
14.4.6　背景的綜合屬性background　394
14.5　盒模型基礎(chǔ)　395
14.6　寬度和高度屬性　396
14.6.1　寬度屬性width　396
14.6.2　高度屬性height　397
14.7　補白屬性　399
14.7.1　上側(cè)補白屬性padding-top　399
14.7.2　右側(cè)補白屬性padding-right　400
14.7.3　下側(cè)補白屬性padding-bottom　401
14.7.4　左側(cè)補白屬性padding-left　402
14.7.5　綜合補白屬性padding　403
14.8　邊框?qū)傩浴?05
14.8.1　邊框樣式屬性border-style　405
14.8.2　邊框?qū)挾葘傩詁order-width　406
14.8.3　邊框顏色屬性border-color　407
14.8.4　邊框上側(cè)樣式屬性border-top-style　409
14.8.5　其他邊框單側(cè)樣式屬性　410
14.8.6　邊框上側(cè)寬度屬性border-top-width　411
14.8.7　其他邊框單側(cè)寬度屬性　412
14.8.8　邊框上側(cè)顏色屬性border-top-color　413
14.8.9　其他邊框單側(cè)顏色屬性　414
14.8.10　邊框上側(cè)綜合屬性border-top　415
14.8.11　其他邊框單側(cè)綜合屬性　416
14.8.12　邊框綜合屬性border　417
14.9　邊界屬性　418
14.9.1　頂部邊界屬性margin-top　418
14.9.2　其他單側(cè)邊界屬性　419
14.9.3　邊界綜合屬性margin　420
14.10　定位屬性　422
14.10.1　定位方式屬性position　422
14.10.2　邊偏移屬性top、right、bottom、left　423
14.10.3　絕對定位　425
14.10.4　相對定位　426
14.10.5　層疊定位屬性z-index　427
14.11　布局屬性　430
14.11.1　浮動屬性float　430
14.11.2　清除浮動屬性clear　434
14.11.3　超出內(nèi)容屬性overflow　436
14.11.4　定義顯示方式屬性display　437
14.11.5　顯示屬性visibility　438
14.12　列表屬性　439
14.12.1　列表樣式屬性list-style-type　440
14.12.2　替換項目符號的圖片屬性list-style-image　441
14.12.3　列表文本排列屬性list-style-position　442
14.12.4　列表綜合屬性list-style　444
14.13　光標顯示屬性cursor　445
14.14　鏈接屬性　446
14.14.1　定義未訪問的鏈接:link　446
14.14.2　定義訪問后的鏈接:visited　447
14.14.3　定義鼠標懸停時的鏈接:hover　448
14.14.4　定義激活的鏈接:active　449
14.14.5　使用類型選擇符a　450
14.14.6　定義鏈接　451
第三篇　腳本編程JavaScript
第15章　JavaScript語言簡介　457
15.1　JavaScript概述　457
15.2　JavaScript的語法基礎(chǔ)　457
15.2.1　JavaScript的代碼格式　457
15.2.2　注釋的使用　458
15.2.3　標識符和關(guān)鍵字　460
15.2.4　在網(wǎng)頁中使用腳本　460
15.2.5　使用JavaScript腳本的情況　462
第16章　JavaScript基本語法　465
16.1　JavaScript的簡單數(shù)據(jù)類型　465
16.1.1　數(shù)字　465
16.1.2　字符串　467
16.1.3　布爾值　468
16.1.4　函數(shù)　469
16.1.5　對象　470
16.2　變量　471
16.2.1　變量的聲明　471
16.2.2　變量的類型　473
16.2.3　變量的作用域　474
16.3　表達式　475
16.4　運算符　476
16.5　基本語句　478
16.5.1　if語句　478
16.5.2　else if語句　479
16.5.3　switch語句　481
16.5.4　while語句　483
16.5.5　do-while語句　484
16.5.6　for語句　486
16.5.7　break語句　487
16.5.8　continue語句　488
16.5.9　var語句　489
16.5.10　function語句　490
16.5.11　return語句　491
16.6　函數(shù)　492
16.7　對象　493
16.7.1　對象的屬性　493
16.7.2　對象方法　494
第17章　處理事件　497
17.1.1　單擊事件onclick　497
17.1.2　鍵盤按下事件onkeydown　498
17.1.3　鍵盤釋放事件onkeypress　499
17.1.4　鼠標按下事件onmousedown　500
17.1.5　鼠標離開事件onmouseout　501
17.1.6　鼠標懸停事件onmouseover　502
17.1.7　載入事件onload　503
17.1.8　聚焦事件onfocus　504
17.1.9　改變事件onchange　505
17.1.10　其他事件屬性　506
第18章　JavaScript實例制作　509
18.1　JavaScript文本特效　509
18.1.1　制作連續(xù)滾動字幕　509
18.1.2　制作轉(zhuǎn)換的頁面標題　511
18.1.3　制作熱點鏈接　512
18.2　JavaScript時間特效　513
18.2.1　顯示當前日期　513
18.2.2　顯示停留時間　514
18.2.3　顯示更新時間　515
18.3　JavaScript窗口特效　516
18.3.1　打開和關(guān)閉窗口　516
18.3.2　定時關(guān)閉窗口　517
18.4　JavaScript表單特效　518
18.4.1　驗證填寫內(nèi)容的長度　518
18.4.2　驗證填寫內(nèi)容為數(shù)字　519
18.4.3　驗證填寫內(nèi)容是否為郵件格式　520
18.5　JavaScript其他特效　521
18.5.1　屏蔽鼠標右鍵　521
18.5.2　制作“加入收藏”和“設(shè)為首頁”　522
第19章　XHTML文檔類型和制作　523
19.1　框架文檔類型和嚴格文檔類型規(guī)范　523
19.1.1　框架文檔類型　523
19.1.2　嚴格文檔類型　523
19.2　制作符合XHTML標準的文檔　524
19.2.1　使用可視化開發(fā)軟件　525
19.2.2　W3C官方驗證　531
19.3　Web 2.0與W3C的Web標準　533
19.3.1　Web 2.0簡介　533
19.3.2　Web標準簡介　534
19.3.3　結(jié)構(gòu)、表現(xiàn)與行為　535
19.3.4　傳統(tǒng)布局與CSS布局　537
19.3.5　使用CSS布局的方法和技巧　537
19.3.6　一個符合Web標準的博客頁面實例　538