CSS全程指南：新手上路、玩轉(zhuǎn)設(shè)計(jì)、深入了解、實(shí)踐演習(xí)

第1篇  新手上路
第1章  Web標(biāo)準(zhǔn)和XHTML基礎(chǔ)    2
1.1  Web標(biāo)準(zhǔn)概述    3
1.1.1  結(jié)構(gòu)    3
1.1.2  表現(xiàn)    4
1.1.3  行為    4
1.2  Web標(biāo)準(zhǔn)的發(fā)展歷史    5
1.3  Web標(biāo)準(zhǔn)的優(yōu)點(diǎn)    6
1.4  XHTML基礎(chǔ)    7
1.4.1  XHTML標(biāo)簽    7
1.4.2  XHTML的優(yōu)點(diǎn)    9
1.4.3  XHTML的良好編寫(xiě)習(xí)慣    10
1.4.4  文檔類(lèi)型    13
1.4.5  定義語(yǔ)言編碼    15
1.5  用Web2.0標(biāo)準(zhǔn)改善現(xiàn)有網(wǎng)站    16
1.5.1  初級(jí)改善    16
1.5.2  中級(jí)改善    17
1.6  小結(jié)    19
第2章  CSS基礎(chǔ)    20
2.1  CSS概述    21
2.1.1  CSS介紹    21
2.1.2  CSS的優(yōu)點(diǎn)    22
2.2  調(diào)用樣式表    23
2.2.1  內(nèi)嵌樣式    23
2.2.2  內(nèi)部樣式表    23
2.2.3  外部樣式表    25
2.3  CSS的單位    27
2.3.1  長(zhǎng)度單位    27
2.3.2  百分比單位    28
2.3.3  顏色單位    28
2.3.4  URL單位    29
2.4  基本語(yǔ)法    29
2.5  選擇器    30
2.5.1  選擇器組    31
2.5.2  class類(lèi)選擇器    31
2.5.3  ID選擇器    34
2.5.4  包含選擇器    35
2.5.5  屬性選擇器    35
2.5.6  通配選擇器    36
2.5.7  子對(duì)象選擇器    36
2.5.8  相鄰選擇器    37
2.5.9  CSS的優(yōu)先權(quán)    37
2.6  偽元素    39
2.7  樣式類(lèi)    41
2.7.1  ID類(lèi)    41
2.7.2  偽類(lèi)    42
2.7.3  類(lèi)繼承    44
2.8  樣式表的層疊性    47
2.9  注釋    49
2.10  CSS的屬性和值    49
2.10.1  字體屬性    49
2.10.2  文本屬性    56
2.10.3  顏色和背景屬性    61
2.10.4  邊框?qū)傩?nbsp;   68
2.10.5  列表屬性    74
2.10.6  定位屬性    80
2.10.7  鼠標(biāo)屬性    82
2.11  小結(jié)    84
第2篇  玩轉(zhuǎn)設(shè)計(jì)
第3章  圖像樣式設(shè)計(jì)    86
3.1  圖像邊框    87
3.2  圖像陰影效果    91
3.3  圖像替代文本    96
3.4  圖片裁剪    98
3.5  制作圖像走廊    100
3.6  小結(jié)    106
第4章  鏈接樣式設(shè)計(jì)    107
4.1  鏈接樣式    108
4.1.1  a:link    108
4.1.2  a:visited    109
4.1.3  a:hover    110
4.1.4  a:active    111
4.2  下劃線個(gè)性化    111
4.3  創(chuàng)建按鈕    114
4.3.1  普通按鈕式鏈接    114
4.3.2  3D效果按鈕式鏈接    116
4.4  圖片翻轉(zhuǎn)鏈接    119
4.5  更換鏈接鼠標(biāo)指針    122
4.6  小結(jié)    124
第5章  列表樣式設(shè)計(jì)    125
5.1  創(chuàng)建垂直導(dǎo)航條    126
5.2  創(chuàng)建“滑動(dòng)門(mén)”標(biāo)簽式導(dǎo)航欄    128
5.2.1  滑動(dòng)門(mén)技術(shù)    128
5.2.2 “滑動(dòng)門(mén)”標(biāo)簽式導(dǎo)航欄實(shí)例    129
5.3  打造個(gè)性折疊菜單    132
5.4  創(chuàng)建下拉菜單    137
5.5  CSS圖像映射    141
5.6  小結(jié)    149
第6章  表格樣式設(shè)計(jì)    150
6.1  變換背景色    151
6.1.1  變換表格背景色    151
6.1.2  變換表格行背景色    153
6.1.3  變換單元格背景色    154
6.2  CSS控制表格的顏色交替    155
6.3  CSS控制表格邊框    156
6.4  制作圓角框    157
6.5  小結(jié)    159
第7章  表單樣式設(shè)計(jì)    160
7.1  表單樣式設(shè)計(jì)    161
7.1.1  表單透明化    161
7.1.2  增加表單中的空隙    162
7.2  表單元素樣式設(shè)計(jì)    163
7.2.1  文本框樣式    163
7.2.2  文本域樣式    166
7.2.3  按鈕樣式    166
7.2.4  下拉列表樣式    167
7.3  小結(jié)    169
第3篇  深入了解
第8章  CSS濾鏡    172
8.1  濾鏡概述    173
8.2  濾鏡屬性    173
8.2.1  Alpha屬性    174
8.2.2  Blur屬性    176
8.2.3  Chroma屬性    180
8.2.4  DropShadow屬性    182
8.2.5  FlipH、FlipV屬性    183
8.2.6  Glow屬性    185
8.2.7  Gray屬性    187
8.2.8  Invert屬性    187
8.2.9  Mask屬性    188
8.2.10  Shadow屬性    189
8.2.11  Wave屬性    191
8.2.12  Xray屬性    194
8.3  小結(jié)    194
第9章  div+CSS介紹    195
9.1  網(wǎng)頁(yè)布局模式    196
9.2  div概況    197
9.2.1  了解div    197
9.2.2  使用div    197
9.2.3  定義div    198
9.2.4  div和span的區(qū)別    199
9.3  div+CSS布局介紹    200
9.3.1  div+CSS布局的優(yōu)點(diǎn)    200
9.3.2  div+CSS布局的缺點(diǎn)    201
9.3.3  何時(shí)使用TABLE    202
9.4  一列布局    203
9.4.1  一列固定寬度    203
9.4.2  一列寬度自適應(yīng)    204
9.4.3  一列寬度居中    205
9.5  二列布局    206
9.5.1  二列固定寬度    206
9.5.2  二列寬度自適應(yīng)    207
9.5.3  二列右列寬度自適應(yīng)    208
9.5.4  二列固定寬度居中    209
9.6  三列布局    210
9.6.1  中列寬度自適應(yīng)    210
9.6.2  三欄布局    212
9.7  高度自適應(yīng)    215
9.8  小結(jié)    216
第4篇  實(shí)戰(zhàn)演習(xí)
第10章  div+CSS打造Blog版面    218
10.1  頁(yè)面布局和規(guī)劃    219
10.1.1  頁(yè)面設(shè)計(jì)    220
10.1.2  文檔目錄和模版設(shè)計(jì)    221
10.2  首頁(yè)設(shè)計(jì)    222
10.2.1  首頁(yè)框架設(shè)計(jì)    222
10.2.2  導(dǎo)航條設(shè)計(jì)    225
10.2.3  主體設(shè)計(jì)    226
10.3  詳細(xì)頁(yè)面設(shè)計(jì)    230
10.4  小結(jié)    232
第11章  Dreamweaver 8+CSS可視化開(kāi)發(fā)    233
11.1  Dreamweaver 8對(duì)CSS的支持    234
11.1.1  新的CSS支持面板    234
11.1.2  CSS可視化助理    238
11.1.3  代碼校驗(yàn)    241
11.1.4  樣式呈現(xiàn)    243
11.2  創(chuàng)建CSS布局    246
11.2.1  新建布局頁(yè)面    246
11.2.2  插入div進(jìn)行布局    247
11.2.3  創(chuàng)建CSS規(guī)則    250
11.3  CSS調(diào)試輔助工具    256
11.3.1  Web Developer插件的安裝    256
11.3.2  Web Developer插件概要    258
11.3.3  Web Developer的主要功能    261
11.3.4  Web Accessibility Toolbar的安裝    269
11.3.5  Web Accessibility Toolbar的主要功能    270
11.4  小結(jié)    270
第12章  CSS打造個(gè)性版面    271
12.1  首頁(yè)設(shè)計(jì)    272
12.1.1  頁(yè)面整體設(shè)計(jì)    272
12.2.2  網(wǎng)頁(yè)header設(shè)計(jì)    274
12.2.3  頁(yè)面主體設(shè)計(jì)    278
12.2.4  網(wǎng)頁(yè)footer設(shè)計(jì)    280
12.2 “家居展覽”頁(yè)面設(shè)計(jì)    281
12.3 “留言本”頁(yè)面設(shè)計(jì)    283
12.4 “注冊(cè)”頁(yè)面設(shè)計(jì)    285
12.5  小結(jié)    287
第13章  CSS Bug以及修復(fù)    288
13.1  常見(jiàn)的CSS Bug    289
13.2  瀏覽器兼容性    292
13.2.1  CSS hack技術(shù)    292
13.2.2  盒模型    298
13.2.3  浮動(dòng)模型    303
13.2.4  IE 3px Bug    306
13.2.5  IE文字溢出現(xiàn)象    307
13.2.6  IE6 Peekaboo Bug（捉迷藏）    309
13.2.7  IE6 Guillotine Bug（斷頭臺(tái)）    310
13.2.8  列表背景消失Bug    312
13.2.9  針對(duì)IE7.0的hack    313
13.2.10  正確看待IE    314
13.3  小結(jié)    315