上冊(cè) |
前言 |
第 1 章 CSS和文檔 |
1.1 Web樣式簡(jiǎn)介 |
1.2 元素 |
1.2.1 置換元素和非置換元素 |
1.2.2 元素的顯示方式 |
1.3 把 CSS 應(yīng)用到 HTML 上 |
1.3.1 link 標(biāo)簽 |
1.3.2 style 元素 |
1.3.3 @import 指令 |
1.3.4 HTTP 鏈接 |
1.3.5 行內(nèi)樣式 |
1.4 樣式表中的內(nèi)容 |
1.4.1 標(biāo)記 |
1.4.2 規(guī)則的結(jié)構(gòu) |
1.4.3 廠商前綴 .25 |
1.4.4 處理空白 .26 |
1.4.5 CSS 注釋 27 |
1.5 媒體查詢 .28 |
1.5.1 用法 .28 |
1.5.2 簡(jiǎn)單的媒體查詢 28 |
1.5.3 媒體類(lèi)型 .29 |
1.5.4 媒體描述符 .30 |
1.5.5 媒體特性描述符和值的類(lèi)型 32 |
1.6 特性查詢 .32 |
1.7 小結(jié) 35 |
第2章 選擇符 .37 |
2.1 樣式的基本規(guī)則.37 |
2.1.1 元素選擇符 .38 |
2.1.2 聲明和關(guān)鍵字 .39 |
2.2 群組 42 |
2.2.1 群組選擇符 .42 |
2.2.2 群組聲明 .44 |
2.2.3 二者結(jié)合 .45 |
2.2.4 在舊瀏覽器中使用新元素.46 |
2.3 類(lèi)選擇符和 ID 選擇符 47 |
2.3.1 類(lèi)選擇符 .47 |
2.3.2 多個(gè)類(lèi) 50 |
2.3.3 ID 選擇符 .51 |
2.3.4 在類(lèi)選擇符和 ID 選擇符之間選擇52 |
2.4 屬性選擇符 53 |
2.4.1 簡(jiǎn)單屬性選擇符 53 |
2.4.2 根據(jù)精準(zhǔn)的屬性值選擇 .55 |
2.4.3 根據(jù)部分屬性值選擇 .57 |
2.4.4 不區(qū)分大小寫(xiě)的標(biāo)識(shí)符 .62 |
2.5 根據(jù)文檔結(jié)構(gòu)選擇 63 |
2.5.1 理解父子關(guān)系 .63 |
2.5.2 后代選擇符 .65 |
2.5.3 選擇子元素 .68 |
2.5.4 選擇緊鄰?fù)?69 |
2.5.5 選擇后續(xù)同胞 .71 |
2.6 偽類(lèi)選擇符 71 |
2.6.1 拼接偽類(lèi) .72 |
2.6.2 結(jié)構(gòu)偽類(lèi) .73 |
2.6.3 動(dòng)態(tài)偽類(lèi) .86 |
2.6.4 UI 狀態(tài)偽類(lèi) 90 |
2.6.5 :target 偽類(lèi) .96 |
2.6.6 :lang 偽類(lèi) 97 |
2.6.7 否定偽類(lèi) .98 |
2.7 偽元素選擇符 100 |
2.7.1 裝飾首字母 101 |
2.7.2 裝飾首行 102 |
2.7.3 對(duì) ::first-letter 和 ::first-line 的限制
. 103 |
2.7.4 裝飾(或創(chuàng)建)前置和后置內(nèi)容元素 . 103 |
2.8 小結(jié) . 104 |
第 3 章 特指度和層疊 .105 |
3.1 特指度
105 |
3.1.1 聲明和特指度 107 |
3.1.2 通用選擇符的特指度 109 |
3.1.3 ID 和屬性選擇符的特指度 . 109 |
3.1.4 行內(nèi)樣式的特指度 . 109 |
3.1.5 重要性 . 110 |
3.2 繼承 . 111 |
3.3 層疊 . 114 |
3.3.1 按權(quán)重和來(lái)源排序 . 115 |
3.3.2 按特指度排序 117 |
3.3.3 按前后位置排序 . 117 |
3.3.4 CSS 之外的表現(xiàn)提示 . 119 |
3.4 小結(jié) . 120 |
第 4 章 值和單位 .121 |
4.1 關(guān)鍵字、字符串和其他文本值 . 121 |
4.1.1 關(guān)鍵字 . 121 |
4.1.2 字符串 . 124 |
4.1.3 URL
125 |
4.1.4 圖像 . 126 |
4.1.5 標(biāo)識(shí)符 . 127 |
4.2 數(shù)字和百分?jǐn)?shù) 127 |
4.2.1 整數(shù) . 127 |
4.2.2 數(shù)字 . 128 |
4.2.3 百分?jǐn)?shù) . 128 |
4.2.4 彈性值 . 128 |
4.3 距離 . 128 |
4.3.1 絕對(duì)長(zhǎng)度單位 129 |
4.3.2 分辨率單位 131 |
4.3.3 相對(duì)長(zhǎng)度單位 132 |
4.4 計(jì)算值
138 |
4.5 屬性值
139 |
4.6 顏色 . 140 |
4.6.1 具名顏色 140 |
4.6.2 RGB 和 RGBa 顏色 141 |
4.6.3 HSL 和 HSLa 顏色 . 146 |
4.6.4 顏色關(guān)鍵字 149 |
4.7 角度 . 149 |
4.8 時(shí)間和頻率
150 |
4.9 位置 . 151 |
4.10 自定義值 . 151 |
第 5 章 字體 155 |
5.1 字體族
155 |
5.1.1 使用通用字體族 . 156 |
5.1.2 指定字體族 157 |
5.2 使用 @font-face 160 |
5.2.1 必須的描述符 161 |
5.2.2 其他字體描述符 . 166 |
5.2.3 組合描述符 169 |
5.3 字重 . 172 |
5.3.1 字重的工作方式 . 173 |
5.3.2 增大字重 175 |
5.3.3 減小字重 178 |
5.3.4 font-weight 描述符 179 |
5.4 字號(hào) . 180 |
5.4.1 絕對(duì)大小 181 |
5.4.2 相對(duì)大小 183 |
5.4.3 百分?jǐn)?shù)和 em . 184 |
5.4.4 字號(hào)的繼承 185 |
5.4.5 使用長(zhǎng)度單位 188 |
5.4.6 自動(dòng)調(diào)整字號(hào) 189 |
5.5 字形 . 191 |
5.6 字體拉伸
195 |
5.7 字距調(diào)整
198 |
5.8 字體變形
198 |
5.8.1 Level 3 新增的值 200 |
5.8.2 font-variant 描述符 . 201 |
5.9 字體特性
202 |
5.10 字體合成 . 204 |
5.11 font 屬性 . 206 |
5.11.1 加入行高 207 |
5.11.2 正確使用簡(jiǎn)寫(xiě) . 208 |
5.11.3 使用系統(tǒng)字體 . 209 |
5.12 字體匹配機(jī)制 210 |
5.13 小結(jié)
212 |
第 6 章 文本屬性 .213 |
6.1 縮進(jìn)和行內(nèi)對(duì)齊 213 |
6.1.1 縮進(jìn)文本 214 |
6.1.2 文本對(duì)齊 217 |
6.1.3 對(duì)齊最后一行 220 |
6.2 塊級(jí)對(duì)齊
222 |
6.2.1 行的高度 222 |
6.2.2 縱向?qū)R文本 226 |
6.3 單詞間距和字符間距 . 231 |
6.3.1 單詞間距 231 |
6.3.2 字符間距 233 |
6.3.3 對(duì)齊方式對(duì)間距的影響 234 |
6.4 文本轉(zhuǎn)換
235 |
6.5 文本裝飾
237 |
6.6 文本渲染效果 241 |
6.7 文本陰影
242 |
6.8 處理空白
244 |
6.9 換行和斷字
248 |
6.10 書(shū)寫(xiě)模式 . 254 |
6.10.1 設(shè)定書(shū)寫(xiě)模式 . 254 |
6.10.2 改變文本方向 . 258 |
6.10.3 聲明方向 259 |
6.11 小結(jié)
261 |
第 7 章 視覺(jué)格式化基礎(chǔ) .262 |
7.1 元素框基礎(chǔ)
262 |
7.1.1 重要概念概覽 263 |
7.1.2 容納塊 . 264 |
7.2 調(diào)整元素的顯示方式 . 265 |
7.2.1 改變顯示方式 266 |
7.2.2 塊級(jí)框 . 268 |
7.2.3 橫向格式化 270 |
7.2.4 橫向格式化屬性 . 271 |
7.2.5 使用 auto 272 |
7.2.6 多個(gè) auto 273 |
7.2.7 負(fù)外邊距 275 |
7.2.8 百分?jǐn)?shù) . 276 |
7.2.9 置換元素 277 |
7.2.10 縱向格式化 278 |
7.2.11 縱向格式化屬性 . 279 |
7.2.12 百分?jǐn)?shù)高度 280 |
7.2.13 自動(dòng)調(diào)整高度 . 282 |
7.2.14 折疊縱向外邊距 . 283 |
7.2.15 負(fù)外邊距和折疊 . 285 |
7.2.16 列表項(xiàng)目 287 |
7.3 行內(nèi)元素
288 |
7.3.1 行布局 . 288 |
7.3.2 基本術(shù)語(yǔ)和概念 . 290 |
7.3.3 行內(nèi)格式化 292 |
7.3.4 行內(nèi)非置換元素 . 293 |
7.3.5 行內(nèi)置換元素 305 |
7.3.6 行內(nèi)塊級(jí)元素 309 |
7.3.7 流動(dòng)顯示方式 312 |
7.3.8 contents 顯示方式 . 313 |
7.3.9 display 的其他值 314 |
7.3.10 計(jì)算值 . 314 |
7.4 小結(jié) . 315 |
第 8 章 內(nèi)邊距、邊框、輪廓和外邊距 .316 |
8.1 基本元素框
316 |
8.2 內(nèi)邊距
319 |
8.2.1 復(fù)值 . 321 |
8.2.2 單邊內(nèi)邊距 323 |
8.2.3 內(nèi)邊距的百分?jǐn)?shù)值 . 324 |
8.2.4 行內(nèi)元素的內(nèi)邊距 . 326 |
8.2.5 置換元素的內(nèi)邊距 . 328 |
8.3 邊框 . 329 |
8.3.1 邊框的式樣 330 |
8.3.2 邊框?qū)挾?334 |
8.3.3 邊框顏色 337 |
8.3.4 簡(jiǎn)寫(xiě)的邊框?qū)傩?. 340 |
8.3.5 整個(gè)邊框 342 |
8.3.6 行內(nèi)元素的邊框 . 343 |
8.3.7 圓角邊框 344 |
8.3.8 圖像邊框 352 |
8.4 輪廓 . 369 |
8.4.1 輪廓式樣 369 |
8.4.2 輪廓寬度 370 |
8.4.3 輪廓顏色 371 |
8.4.4 唯一的輪廓簡(jiǎn)寫(xiě)屬性 373 |
8.4.5 輪廓與邊框的區(qū)別 . 373 |
8.5 外邊距
375 |
8.5.1 外邊距的長(zhǎng)度值 . 377 |
8.5.2 外邊距的百分?jǐn)?shù)值 . 377 |
8.5.3 單邊外邊距屬性 . 378 |
8.5.4 外邊距折疊 379 |
8.5.5 負(fù)外邊距 381 |
8.5.6 行內(nèi)元素的外邊距 . 383 |
8.6 小結(jié) . 385 |
第 9 章 顏色、背景和漸變 386 |
9.1 顏色 . 386 |
9.1.1 前景色 . 386 |
9.1.2 對(duì)邊框的影響 388 |
9.1.3 對(duì)表單元素的影響 . 390 |
9.1.4 繼承顏色 391 |
9.2 背景 . 391 |
9.2.1 背景色 . 391 |
9.2.2 裁剪背景 395 |
9.2.3 背景圖 . 398 |
9.2.4 背景定位 402 |
9.2.5 改變定位框 411 |
9.2.6 背景重復(fù)方式(或不重復(fù)) . 415 |
9.2.7 背景粘附 425 |
9.2.8 控制背景圖的尺寸 . 430 |
9.2.9 寫(xiě)為一個(gè)屬性 438 |
9.2.10 多個(gè)背景 440 |
9.3 漸變 . 447 |
9.3.1 線性漸變 447 |
9.3.2 徑向漸變 461 |
9.3.3 處理漸變圖像 473 |
9.3.4 循環(huán)漸變 475 |
9.4 盒子投影
479 |
9.5 小結(jié) . 482 |
|
下冊(cè) |
第10章 浮動(dòng)及其形狀 |
第11章 定位 |
第12章 彈性盒布局 |
第13章 柵格布局 |
第14章 CSS中的表格布局 |
第15章 列表和生成的內(nèi)容 |
第16章 變形 |
第17章 過(guò)渡 |
第18章 動(dòng)畫(huà) |
第19章 濾鏡、混合、裁剪和遮罩 |
第20章 針對(duì)特定媒體的樣式 |
附錄A 支持動(dòng)畫(huà)的屬性 |
附錄B 基本屬性參考 |
附錄C 顏色對(duì)照表 |