即用即查HTML+CSS標簽參考手冊

上篇　HTML標記詳解
第1章　HTML入門　3
1.1　HTML的基本概念　3
1.1.1　HTML簡介　3
1.1.2　HTML的基本結(jié)構(gòu)　3
1.1.3　HTML的標記　4
1.2　一個簡單的HTML實例　5
1.2.1　編寫HTML代碼　5
1.2.2　運行HTML文件查看效果　7
1.3　HTML基本標記　7
1.3.1　文件類型： HTML 　7
1.3.2　文件頭： HEAD 　8
1.3.3　文件主體： BODY 　8
1.4　頁面標題：TITLE　8
1.5　小結(jié)　9
第2章　與瀏覽器相關(guān)的結(jié)構(gòu)性標記　10
2.1　標題文字　10
2.1.1　標題標記：H　10
2.1.2　標題的對齊：ALIGN　11
2.2　層　12
2.2.1　層標記：DIV　12
2.2.2　層的對齊：ALIGN　13
2.2.3　層的樣式設(shè)置：STYLE　14
2.3　文字相關(guān)　16
2.3.1　斜體：EM　16
2.3.2　文字的加粗：STRONG　17
2.3.3　引文：CITE　18
2.3.4　程序碼：CODE　18
2.3.5　鍵盤輸入：KBD　19
2.3.6　變量聲明：VAR　20
2.3.7　字體加大和縮小：BIG、SMALL　21
2.4　其他標記　21
2.4.1　文本縮進：BLOCKQUOTE　22
2.4.2　樣本：SAMP　23
2.4.3　定義：DFN　23
2.4.4　地址：ADDRESS　24
第3章　設(shè)置頁面元素外觀　26
3.1　文字外觀　26
3.1.1　加粗文字：B　26
3.1.2　斜體：I　27
3.1.3　下劃線：U　27
3.1.4　刪除線：S　28
3.1.5　上標與下標：SUB、SUP　29
3.1.6　打字機字體：TT　30
3.1.7　基本字大?。築ASEFONT SIZE　31
3.1.8　字體大小：FONT SIZE　32
3.1.9　字體顏色：FONT COLOR　33
3.1.10　設(shè)置字體：FONT FACE　34
3.2　預(yù)定義格式標記：PRE　35
3.3　居中對齊：CENTER　36
3.4　閃爍：BLINK　37
第4章　超級鏈接　38
4.1　超級鏈接的基本標記　38
4.1.1　設(shè)置超級鏈接：A　38
4.1.2　鏈接地址：HREF　38
4.1.3　目標頁面：TARGET　40
4.2　網(wǎng)頁中的錨點　41
4.2.1　設(shè)定錨點：NAME　41
4.2.2　鏈接到錨點：#　42
4.3　設(shè)置不同的鏈接對象　46
4.3.1　鏈接網(wǎng)站內(nèi)部的頁面　46
4.3.2　鏈接文件　47
4.3.3　設(shè)置外部鏈接：鏈接HTTP頁面　47
4.3.4　設(shè)置外部鏈接：鏈接FTP頁面　48
4.3.5　使用Telnet鏈接BBS站點　49
4.3.6　發(fā)送E-mail　50
第5章　圖像與多媒體　52
5.1　添加圖像　52
5.1.1　圖像標記：IMG　52
5.1.2　設(shè)置圖像源文件：SRC　52
5.2　設(shè)置圖像屬性　54
5.2.1　設(shè)置大?。篧IDTH、HEIGHT　54
5.2.2　對齊方式：ALIGN　56
5.2.3　替換文字：ALT　57
5.2.4　設(shè)置邊框：BORDER　59
5.2.5　設(shè)置邊距：HSPACE、VSPACE　60
5.2.6　低解析度圖像：LOWSRC　61
5.3　圖像的超級鏈接　63
5.3.1　對整幅圖像設(shè)置超級鏈接　63
5.3.2　應(yīng)用圖像地圖：MAP　64
5.4　設(shè)置背景音樂　71
5.4.1　添加背景音樂：BGSOUND　71
5.4.2　設(shè)置背景音樂的循環(huán)播放次數(shù)：LOOP　72
5.5　多媒體元素　72
5.5.1　添加多媒體元素：EMBED　72
5.5.2　設(shè)置自動運行：AUTOSTART　73
5.5.3　設(shè)置循環(huán)播放：LOOP　74
5.5.4　隱藏面板：HIDDEN　75
5.5.5　添加其他類型的多媒體文件　76
5.6　動態(tài)文字　77
5.6.1　添加滾動文字：MARQUEE　77
5.6.2　文字滾動方向：DIRECTION　78
5.6.3　設(shè)置文字的滾動方式：BEHAVIOR　79
5.6.4　調(diào)整文字滾動速度：SCROLLAMOUNT　80
5.6.5　設(shè)置滾動延遲：SCROLLDELAY　81
5.6.6　循環(huán)設(shè)置：LOOP　82
5.6.7　設(shè)置滾動文字的背景：BGCOLOR　83
5.6.8　滾動背景面積：WIDTH、HEIGHT　85
5.6.9　設(shè)置空白空間：HSPACE、VSPACE　86
第6章　頁面的布局與分隔　88
6.1　段落標記　88
6.1.1　段落標記：P　88
6.1.2　段落文字對齊方式：ALIGN　89
6.2　文字的換行　90
6.2.1　換行標記：BR　90
6.2.2　設(shè)置不可換行：NOBR　91
6.2.3　強制換行：WBR　92
6.3　水平線　93
6.3.1　插入水平線：HR　93
6.3.2　水平線高度：SIZE　94
6.3.3　水平線寬度：WIDTH　95
6.3.4　水平線的對齊方式：ALIGN　96
6.3.5　設(shè)置為實線效果：NOSHADE　97
6.3.6　水平線的顏色：COLOR　98
第7章　列表　100
7.1　無序列表　100
7.1.1　無序列表標記：UL　100
7.1.2　設(shè)置無序列表的符號類型：TYPE　101
7.2　有序列表的設(shè)計　102
7.2.1　有序列表標記：OL　103
7.2.2　有序列表的序號類型：TYPE　103
7.2.3　有序列表的起始數(shù)值：START　104
7.3　定義列表標記：DL　106
7.4　菜單列表標記：MENU　107
7.5　目錄列表：DIR　108
第8章　表單　110
8.1　添加表單：FORM　110
8.1.1　處理程序：ACTION　110
8.1.2　表單名稱：NAME　112
8.1.3　傳送方法：METHOD　112
8.1.4　編碼方式：ENCTYPE　113
8.2　輸入類控件　114
8.2.1　輸入控件類型：INPUT TYPE　114
8.2.2　文本框控件：INPUT TYPE=“text”　115
8.2.3　密碼域控件：INPUT TYPE=“password”　116
8.2.4　文件域：INPUT TYPE=“file”　117
8.2.5　復(fù)選框：INPUT TYPE=“checkbox”　118
8.2.6　單選按鈕：INPUT TYPE=“radio”　119
8.2.7　普通按鈕：INPUT TYPE=“button”　121
8.2.8　提交按鈕：INPUT TYPE=“submit”　122
8.2.9　重置按鈕：INPUT TYPE=“reset”　123
8.2.10　圖像區(qū)域控件：INPUT TYPE=“image”　124
8.2.11　隱藏域：INPUT TYPE=“hidden”　125
8.2.12　控件名稱： INPUT NAME=“***” 　127
8.2.13　控件默認取值： INPUT VALUE=“***” 　128
8.2.14　已選定的選項：CHECKED　130
8.2.15　控件長度：SIZE　131
8.2.16　設(shè)置最多字符：MAXLENGTH　132
8.3　下拉式選單　134
8.3.1　添加選單控件：SELECT　134
8.3.2　選單顯示的項目數(shù)：SIZE　135
8.3.3　選單控件名稱：NAME　136
8.3.4　設(shè)置選項值：VALUE　137
8.3.5　已選定的選項：SELECTED　138
8.3.6　設(shè)置列表項目的多選：MULTIPLE　139
8.4　文本輸入?yún)^(qū)　141
8.4.1　文本輸入?yún)^(qū)域：TEXTAREA　141
8.4.2　設(shè)置名稱：NAME　142
8.4.3　設(shè)置輸入?yún)^(qū)大?。篟OWS、COLS　143
8.4.4　輸入?yún)^(qū)的默認值　143
8.4.5　輸入?yún)^(qū)換行方式：WRAP　145
第9章　表格　147
9.1　創(chuàng)建表格　147
9.2　表格屬性　148
9.2.1　表格邊框：BORDER　148
9.2.2　表格的邊框顏色：BORDERCOLOR　149
9.2.3　表格的亮邊框：BORDERCOLORLIGHT　151
9.2.4　表格的暗邊框顏色：BORDERCOLORDARK　152
9.2.5　表格寬度：WIDTH　153
9.2.6　設(shè)置表格的高度：HEIGHT　154
9.2.7　設(shè)置表格背景色：BGCOLOR　155
9.2.8　設(shè)置表格的背景圖像：BACKGROUND　156
9.2.9　表格內(nèi)框?qū)挾龋篊ELLSPACING　157
9.2.10　文字與邊框距離：CELLPADDING　158
9.2.11　設(shè)置表格的對齊方式：ALIGN　160
9.3　表格行屬性設(shè)置　161
9.3.1　高度的控制：HEIGHT　162
9.3.2　邊框顏色：BORDERCOLOR　163
9.3.3　行的背景色：BGCOLOR　164
9.3.4　行文字的水平對齊方式：ALIGN　165
9.3.5　行文字的垂直對齊方式：VALIGN　166
9.3.6　行的亮邊框顏色：BORDERCOLORLIGHT　167
9.3.7　設(shè)置行的暗邊框顏色：BORDERCOLORDARK　168
9.4　調(diào)整單元格屬性　169
9.4.1　單元格大?。篧IDTH、HEIGHT　169
9.4.2　水平跨度：COLSPAN　171
9.4.3　垂直跨度：ROWSPAN　172
9.4.4　對齊方式：ALIGN、VALIGN　174
9.4.5　設(shè)置單元格的背景色：BGCOLOR　175
9.4.6　設(shè)置單元格的背景圖像：BACKGROUND　176
9.4.7　單元格的邊框顏色：BORDERCOLOR　177
9.4.8　設(shè)置單元格的亮邊框：BORDERCOLORLIGHT　178
9.4.9　設(shè)置單元格的暗邊框：BORDERCOLORDARK　179
9.4.10　文字內(nèi)容不換行：NOWRAP　180
9.5　表格的結(jié)構(gòu)　181
9.5.1　表格的表首：THEAD　181
9.5.2　設(shè)計表首樣式　182
9.5.3　表格的主體：TBODY　183
9.5.4　設(shè)計表主體的樣式　185
9.5.5　表格的表尾：TFOOT　185
9.5.6　設(shè)計表尾樣式　187
9.6　表格的表頭：TH　188
9.7　表格的標題　190
9.7.1　添加標題單元格：CAPTION　190
9.7.2　標題的水平對齊方式：ALIGN　191
9.7.3　標題的垂直對齊方式：VALIGN　192
9.8　表格的嵌套　194
第10章　框架結(jié)構(gòu)　196
10.1　插入框架： FRAMESET 　196
10.2　分割窗口　196
10.2.1　上下分割窗口：ROWS　197
10.2.2　左右分割窗口：COLS　199
10.2.3　窗口的嵌套分割　200
10.3　設(shè)置框架邊框　201
10.3.1　設(shè)置邊框：FRAMEBORDER　201
10.3.2　框架的邊框?qū)挾龋篎RAMESPACING　203
10.3.3　框架的邊框顏色：BORDERCOLOR　204
10.4　設(shè)置窗口屬性　205
10.4.1　頁面源文件：SRC　205
10.4.2　頁面名稱：NAME　207
10.4.3　設(shè)置框架滾動條顯示：SCROLLING　208
10.4.4　設(shè)置框架邊緣寬度：MARGINWIDTH　210
10.4.5　設(shè)置框架邊緣高度：MARGINHEIGHT　211
10.4.6　禁止調(diào)整窗口的尺寸：NORESIZE　212
10.4.7　不支持框架標記：NOFRAMES　213
10.5　浮動框架　215
10.5.1　插入浮動框架IFRAME　215
10.5.2　浮動框架大?。篧IDTH、HEIGHT　216
10.5.3　浮動框架的對齊方式：ALIGN　217
10.5.4　設(shè)置邊框顯示屬性：FRAMEBORDER　218
10.5.5　設(shè)置框架邊緣寬度：MARGINWIDTH　219
10.5.6　設(shè)置框架邊緣高度：MARGINHEIGHT　220
10.5.7　設(shè)置框架滾動條：SCROLLING　220
10.5.8　設(shè)置框架名稱：NAME　222
10.6　框架的鏈接　223
10.6.1　普通框架頁面的鏈接：FRAME NAME　223
10.6.2　浮動框架頁面的鏈接：IFRAME NAME　226
第11章　其他常用標記　228
11.1　元信息標記：META　228
11.1.1　設(shè)置頁面關(guān)鍵字：NAME=“keywords”　228
11.1.2　設(shè)置頁面描述文字：NAME=“discription”　229
11.1.3　設(shè)置編輯工具：NAME=“generator”　229
11.1.4　設(shè)定作者信息：NAME=“author”　230
11.1.5　限制搜索方式：NAME=“robots”　230
11.1.6　設(shè)置版權(quán)聲明：NAME=“copyright”　231
11.1.7　設(shè)置頁面的創(chuàng)建日期：NAME=“build”　232
11.1.8　設(shè)置聯(lián)系人郵箱：NAME=“reply-to”　232
11.1.9　設(shè)置頁面語言：HTTP-EQUIV=“Content-Language”　233
11.1.10　設(shè)置網(wǎng)頁的定時刷新和跳轉(zhuǎn)：HTTP-EQUIV=“refresh”　233
11.1.11　設(shè)置網(wǎng)頁的到期時間：HTTP-EQUIV=“expires”　235
11.1.12　禁止調(diào)用緩存：HTTP-EQUIV=“cache-control”　235
11.1.13　刪除過期的cookie：HTTP-EQUIV=“set-cookie”　236
11.1.14　以獨立窗口打開：HTTP-EQUIV=“window-target”　237
11.1.15　設(shè)置網(wǎng)頁的過渡效果：HTTP-EQUIV=“過渡事件”　238
11.2　基底網(wǎng)址：BASE　243
11.3　頁面相關(guān)鏈接：LINK　244
11.4　頁面背景與顏色　245
11.4.1　背景顏色：BGCOLOR　246
11.4.2　背景圖像：BACKGROUND　246
11.4.3　固定顯示頁面背景圖像：BGPROPERTIES　248
11.4.4　鏈接文字的初始顏色：LINK　249
11.4.5　設(shè)置使用中的鏈接文字顏色：ALINK　250
11.4.6　修改訪問過的鏈接文字顏色：VLINK　251
11.4.7　設(shè)置頁面文字顏色：TEXT　252
11.5　頁面邊距　253
11.5.1　設(shè)置頁面的左邊距：LEFTMARGIN　253
11.5.2　設(shè)置頁面上邊距：TOPMARGIN　254
11.6　特殊字符　255
11.6.1　空格： 　255
11.6.2　其他特殊字符　256
11.7　頁面注釋　257
下篇　CSS標記詳解
第12章　CSS樣式表簡介　261
12.1　CSS樣式表的概念　261
12.2　CSS樣式表的類型　261
12.2.1　類選擇器樣式　262
12.2.2　ID選擇器樣式　262
12.2.3　重定義標記樣式　262
12.2.4　特殊樣式　263
12.3　CSS樣式表的設(shè)置方法　263
12.3.1　鏈入外部樣式表　263
12.3.2　導(dǎo)入外部樣式表　264
12.3.3　內(nèi)部樣式表　264
12.3.4　內(nèi)嵌樣式　265
12.4　CSS樣式表書寫原則　265
第13章　文字屬性　267
13.1　設(shè)置字體　267
13.1.1　設(shè)置字體：font-family　267
13.1.2　設(shè)置字號：font-size　268
13.1.3　設(shè)置斜體效果：font-style　270
13.1.4　設(shè)置加粗字體：font-weight　271
13.1.5　設(shè)置英文大寫：font-variant　272
13.1.6　復(fù)合屬性：字體：font　273
13.2　文本的對齊與排列　274
13.2.1　文本的水平對齊：text-align　274
13.2.2　縱向?qū)R：vertical-align　275
13.2.3　文本反排：direction與unicode-bidi　277
13.2.4　元素布局方式：writing-mode　278
13.3　文本的換行　279
13.3.1　字內(nèi)換行：word-break　279
13.3.2　日文文本的換行：line-break　281
13.3.3　超過容器邊界時的換行：word-wrap　282
13.4　文字的修飾　283
13.4.1　設(shè)置文字修飾：text-decoration　283
13.4.2　設(shè)置下劃線的線條位置：text-underline-position　285
13.5　設(shè)置文字間隔　286
13.5.1　單詞間隔：word-spacing　286
13.5.2　字符間隔：letter-spacing　287
13.6　其他文本屬性　288
13.6.1　文本轉(zhuǎn)換：text-transform　288
13.6.2　文本縮進：text-indent　289
13.6.3　文本行高：line-height　290
13.6.4　處理空白：white-space　291
13.6.5　設(shè)置顏色：color　291
第14章　元素的背景　293
14.1　設(shè)置背景顏色：background-color　293
14.2　設(shè)置背景圖像　294
14.2.1　背景圖像：background-image　294
14.2.2　圖像的平鋪：background-repeat　295
14.2.3　圖像與頁面的布局：background-attachment　298
14.2.4　圖像位置：background-position　300
14.3　背景的復(fù)合屬性：background　303
第15章　邊框的設(shè)置　305
15.1　邊框的風(fēng)格　305
15.1.1　上邊框的風(fēng)格：border-top-style　305
15.1.2　右邊框的風(fēng)格：border-right-style　307
15.1.3　下邊框的風(fēng)格：border-bottom-style　308
15.1.4　左邊框的風(fēng)格：border-left-style　310
15.1.5　設(shè)置邊框的風(fēng)格：border-style　311
15.2　邊框的顏色　312
15.2.1　上邊框的顏色：border-top-color　312
15.2.2　右邊框的顏色：border-right-color　314
15.2.3　下邊框的顏色：border-bottom-color　315
15.2.4　左邊框的顏色：border-left-color　316
15.2.5　設(shè)置邊框的顏色：border-color　318
15.3　邊框的寬度　319
15.3.1　上邊框的寬度：border-top-width　319
15.3.2　右邊框的寬度：border-right-width　321
15.3.3　下邊框的寬度：border-bottom-width　322
15.3.4　左邊框的寬度：border-left-width　323
15.3.5　設(shè)置邊框的寬度：border-width　325
15.4　分別設(shè)置各個邊框　326
15.4.1　設(shè)置上邊框：border-top　326
15.4.2　設(shè)置右邊框：border-right　327
15.4.3　設(shè)置下邊框：border-bottom　329
15.4.4　設(shè)置左邊框：border-left　330
15.5　設(shè)置邊框的整體效果：border　331
15.6　邊框?qū)傩栽诳蚣芙Y(jié)構(gòu)中的應(yīng)用　333
15.6.1　設(shè)置框架中的邊框風(fēng)格：border-style　333
15.6.2　設(shè)置框架的其他邊框?qū)傩裕篵order　334
15.7　表格相鄰邊框的合并：border-collapse　335
第16章　邊距與補白屬性　338
16.1　設(shè)置邊距　338
16.1.1　頂端邊距：margin-top　338
16.1.2　底部邊距：margin-bottom　339
16.1.3　左側(cè)邊距：margin-left　340
16.1.4　右側(cè)邊距：margin-right　341
16.1.5　邊距：margin　342
16.2　設(shè)置頁面的補白　343
16.2.1　頂端補白：padding-top　343
16.2.2　底部補白：padding-bottom　344
16.2.3　左側(cè)補白：padding-left　345
16.2.4　右側(cè)補白：padding-right　346
16.2.5　補白：padding　347
第17章　區(qū)塊屬性　349
17.1　對象的定位　349
17.1.1　定位方式：position　349
17.1.2　元素距頂端的垂直距離：top　349
17.1.3　元素距離左端的水平距離：left　351
17.1.4　元素距離右端的水平距離：right　351
17.1.5　元素距離下端的水平距離：bottom　352
17.1.6　層疊順序：z-index　354
17.2　布局屬性　355
17.2.1　浮動屬性：float　356
17.2.2　清除屬性：clear　357
17.2.3　可視區(qū)域：clip　358
17.2.4　超出范圍：overflow　359
17.2.5　設(shè)置水平方向超出范圍的處理方式：overflow-x　361
17.2.6　設(shè)置垂直方向超出范圍的處理方式：overflow-y　362
17.2.7　可見屬性：visibility　363
17.3　尺寸設(shè)置：width、height　366
第18章　濾鏡　368
18.1　濾鏡的簡介　368
18.2　濾鏡的使用　369
18.2.1　透明效果：alpha　369
18.2.2　動感模糊：blur　372
18.2.3　對顏色進行透明處理：chroma　374
18.2.4　設(shè)置陰影：dropshadow　376
18.2.5　漸變陰影效果：shadow　377
18.2.6　對象的水平翻轉(zhuǎn)：flipH　379
18.2.7　對象的垂直翻轉(zhuǎn)：flipV　379
18.2.8　發(fā)光效果：glow　380
18.2.9　灰度處理：gray　382
18.2.10　反相處理：invert　383
18.2.11　X光片效果：xray　384
18.2.12　遮罩效果：mask　385
18.2.13　波形濾鏡：wave　386
18.3　應(yīng)用多個濾鏡實現(xiàn)特殊效果：創(chuàng)建水中倒影　390
第19章　其他CSS屬性　392
19.1　列表屬性　392
19.1.1　列表符號：list-style-type　392
19.1.2　圖像符號：list-style-image　394
19.1.3　列表縮進：list-style-position　395
19.1.4　列表：list-style　396
19.2　光標屬性：cursor　397
19.3　滾動條屬性　399
19.3.1　滾動條表面的顏色：scrollbar-face-color　400
19.3.2　滾動條的亮邊顏色：scrollbar-highlight-color　401
19.3.3　滾動條暗邊顏色：scrollbar-shadow-color　402
19.3.4　滾動條方向箭頭的顏色：scrollbar-arrow-color　403
19.3.5　滾動條基本顏色：scrollbar-base-color　404
附錄1　HTML中支持的顏色名稱　406
附錄2　CSS各屬性適應(yīng)的瀏覽器　415
附錄3　IE 7.0對CSS的支持　419