《CSS選擇器世界》是2020年2月人民郵電出版社出版的圖書，作者是張鑫旭。
基本介紹
- 中文名：CSS選擇器世界
- 作者：張鑫旭
- 出版時間：2020年2月
- 出版社：人民郵電出版社
- 頁數：192 頁
- ISBN：9787115517227
- 定價：59 元
- 開本：16 開
- 裝幀：平裝
內容簡介,圖書目錄,
內容簡介
CSS選擇器是CSS世界的支柱，撐起了整個精彩紛呈的CSS世界。本書專門介紹CSS選擇器的相關知識。在本書中，作者結合多年從業經驗，在CSS基礎知識之上，充分考慮前端開發人員的開發需求，以CSS選擇器的基本概念、優先權、命名、最佳實踐以及各偽類選擇器的概述和適用場景為技術主線，為CSS開發人員介紹有競爭力的知識和技能。此外，本書配有專門的網站，用以進行實例展示和問題答疑。
作為一本CSS進階書，本書非常適合有一定CSS基礎的前端開發人員學習和參考。
圖書目錄
第 1章 概述 1
1.1 為什麼CSS選擇器很強 1
1.2 CSS選擇器世界的一些基本概念 1
1.2.1 選擇器、選擇符、偽類和偽元素 2
1.2.2 CSS選擇器的作用域 3
1.2.3 CSS選擇器的命名空間 4
1.3 無效CSS選擇器特性與實際套用 5
第 2章 CSS選擇器的優先權 7
2.1 CSS優先權規則概覽 7
2.2 深入CSS選擇器優先權 8
2.2.1 CSS選擇器優先權的計算規則 8
2.2.2 256個選擇器的越級現象 11
2.3 為什麼按鈕:hover變色了 12
第3章 CSS選擇器的命名 13
3.1 CSS選擇器是否區分大小寫 13
3.2 CSS選擇器命名的合法性 14
3.3 CSS選擇器的命名是一個哲學問題 17
3.3.1 長命名還是短命名 18
3.3.2 單命名還是組合命名 18
3.3.3 面向屬性的命名和面向語義的命名 20
3.3.4 我是如何取名的 21
3.4 CSS選擇器設計的最佳實踐 24
3.4.1 不要使用ID選擇器 25
3.4.2 不要嵌套選擇器 25
3.4.3 不要歧視面向屬性的命名 28
3.4.4 正確使用狀態類名 30
3.4.5 最佳實踐匯總 33
第4章 精通CSS選擇符 37
4.1 後代選擇符空格（ ） 37
4.1.1 對CSS後代選擇符可能錯誤的認識 37
4.1.2 對JavaScript中後代選擇符可能錯誤的認識 39
4.2 子選擇符箭頭（＞） 41
4.2.1 子選擇符和後代選擇符的區別 41
4.2.2 適合使用子選擇符的場景 42
4.3 相鄰兄弟選擇符加號（+） 43
4.3.1 相鄰兄弟選擇符的相關細節 44
4.3.2 實現類似:first-child的效果 45
4.3.3 眾多高級選擇器技術的核心 47
4.4 隨後兄弟選擇符彎彎（~） 48
4.4.1 和相鄰兄弟選擇符區別 48
4.4.2 為什麼沒有前面兄弟選擇符 49
4.4.3 如何實現前面兄弟選擇符的效果 49
4.5 快速了解列選擇符雙管道（||） 52
第5章 元素選擇器 55
5.1 元素選擇器的級聯語法 55
5.2 標籤選擇器二三事 57
5.2.1 標籤選擇器混合其他選擇器的最佳化 57
5.2.2 標籤選擇器與自定義元素 57
5.3 特殊的標籤選擇器：通配選擇器 58
第6章 屬性選擇器 59
6.1 ID選擇器和類選擇器 59
6.2 屬性值直接匹配選擇器 60
6.2.1 詳細了解4種選擇器 61
6.2.2 AMCSS開發模式簡介 66
6.3 屬性值正則匹配選擇器 67
6.3.1 詳細了解3種選擇器 68
6.3.2 CSS屬性選擇器搜尋過濾技術 71
6.4 忽略屬性值大小寫的正則匹配運算符 72
第7章 用戶行為偽類 75
7.1 手型經過偽類:hover 75
7.1.1 體驗最佳化與:hover延時 75
7.1.2 非子元素的:hover顯示 76
7.1.3 純:hover顯示浮層的體驗問題 78
7.2 激活狀態偽類:active 79
7.2.1 :active偽類概述 79
7.2.2 按鈕的通用:active樣式技巧 80
7.2.3 :active偽類與CSS數據上報 82
7.3 焦點偽類:focus 82
7.3.1 :focus偽類匹配機制 83
7.3.2 :focus偽類與outline 85
7.3.3 CSS :focus偽類與鍵盤無障礙訪問 86
7.4 整體焦點偽類:focus-within 89
7.4.1 :focus-within和:focus偽類的區別 89
7.4.2 :focus-within實現無障礙訪問的下拉列表 89
7.5 鍵盤焦點偽類:focus-visible 91
第8章 URL定位偽類 95
8.1 連結歷史偽類:link和:visited 95
8.1.1 深入理解:link 95
8.1.2 怪癖最多的CSS偽類:visited 97
8.2 超連結偽類:any-link 100
8.3 目標偽類:target 101
8.3.1 :target與錨點 102
8.3.2 :target互動布局技術簡介 104
8.4 目標容器偽類:target-within 108
第9章 輸入偽類 109
9.1 輸入控制項狀態 109
9.1.1 可用狀態與禁用狀態偽類:enabled和:disabled 109
9.1.2 讀寫特性偽類:read-only和:read-write 113
9.1.3 占位符顯示偽類:placeholder-shown 115
9.1.4 默認選項偽類:default 118
9.2 輸入值狀態 120
9.2.1 選中選項偽類:checked 121
9.2.2 不確定值偽類:indeterminate 133
9.3 輸入值驗證 136
9.3.1 有效性驗證偽類:valid和:invalid 136
9.3.2 範圍驗證偽類:in-range和:out-of-range 140
9.3.3 可選性偽類:required和:optional 142
9.3.4 用戶互動偽類:user-invalid和空值偽類:blank 146
第 10章 樹結構偽類 147
10.1 :root偽類 147
10.1.1 :root偽類和元素 147
10.1.2 :root偽類的套用場景 148
10.2 :empty偽類 150
10.2.1 對:empty偽類可能的誤解 152
10.2.2 超實用超高頻使用的:empty偽類 154
10.3 子索引偽類 156
10.3.1 :first-child偽類和:last-child偽類 156
10.3.2 :only-child偽類 158
10.3.3 :nth-child( )偽類和:nth-last-child( )偽類 160
10.4 匹配類型的子索引偽類 166
10.4.1 :first-of-type偽類和:last-of-type偽類 166
10.4.2 :only-of-type偽類 167
10.4.3 :nth-of-type( )偽類和:nth-last-of-type( )偽類 168
第 11章 邏輯組合偽類 173
11.1 否定偽類:not( ) 173
11.2 了解任意匹配偽類:is( ) 177
11.2.1 :is( )偽類與:matches( )偽類及:any( )偽類之間的關係 177
11.2.2 :is( )偽類的語法與作用 178
11.3 了解任意匹配偽類:where( ) 179
11.4 了解關聯偽類:has( ) 179
第 12章 其他偽類選擇器 181
12.1 與作用域相關的偽類 181
12.1.1 參考元素偽類:scope 181
12.1.2 Shadow樹根元素偽類:host 183
12.1.3 Shadow樹根元素匹配偽類:host( ) 184
12.1.4 Shadow樹根元素上下文匹配偽類:host-context( ) 185
12.2 與全螢幕相關的偽類:fullscreen 187
12.3 了解語言相關偽類 188
12.3.1 方向偽類:dir( ) 189
12.3.2 語言偽類:lang( ) 190
12.4 了解資源狀態偽類 191
