譯者序　　xi
前言　　xiii
第1章　重構和架構　　1
1.1 什麼是重構　　1
1.2 什麼是軟件架構　　1
1.2.1 優秀架構是可預測的　　2
1.2.2 優秀架構可提升代碼復用性　　2
1.2.3 優秀架構可擴展　　2
1.2.4 優秀架構可維護　　2
1.2.5 優秀架構和重構　　2
1.3 需要重構的原因　　2
1.3.1 需求變更　　3
1.3.2 架構設計不閤理　　3
1.3.3 低估睏難　　3
1.3.4 忽視最佳實踐　　3
1.4 什麼情況下應該重構代碼　　4
1.5 什麼情況下不應該重構代碼　　4
1.6 我能重構自己的代碼嗎　　4
1.7 重構示例　　5
1.7.1 重構示例　　1：計算電子商務訂單的總價　　5
1.7.2 重構示例　　2: 重構CSS的簡單示例　　15
1.8 總結　　17
第2章　級聯　　19
2.1 什麼是級聯　　19
2.2 選擇器特指度　　19
2.3 規則集順序　　21
2.4 行內CSS和特指度　　21
2.5 用!important聲明覆蓋級聯樣式　　22
2.6 總結　　23
第3章　編寫更優質的CSS　　25
3.1 使用注釋　　25
3.2 結構一緻的規則集　　26
3.3 保持選擇器的簡單　　27
3.4 分離CSS和JavaScript　　31
3.4.1 在JavaScript中使用帶前綴的類和ID　　31
3.4.2 用類修改元素樣式　　32
3.5 使用類　　32
3.6 類名要有意義　　33
3.7 創建更好的盒子　　34
3.7.1 盒子尺寸：content-box　　36
3.7.2 盒子尺寸：border-box　　36
3.7.3 content-box或border-box　　36
3.8 總結　　37
第4章　為樣式分類　　39
4.1　樣式分類的重要性　　39
4.2　通用樣式　　39
4.3　基礎樣式　　40
4.3.1　定義基礎樣式　　40
4.3.2　文檔元數據元素　　41
4.3.3　區塊元素　　41
4.3.4　標題和文本元素　　42
4.3.5　錨點標簽元素　　44
4.3.6　文本語義元素　　45
4.3.7　列錶　　45
4.3.8　組閤元素　　47
4.3.9　錶格　　47
4.3.10　錶單　　48
4.3.11　圖像　　50
4.4　組件樣式　　50
4.4.1　定義需要實現的行為　　51
4.4.2　保持組件樣式的粒度　　51
4.4.3　根據需要，改寫元素容器的樣式　　54
4.4.4　將定義尺寸的任務交給結構化容器　　59
4.5　結構化樣式　　63
4.6　功能樣式　　66
4.7　瀏覽器特定樣式　　66
4.8　總結　　67
第5章　測試　　69
5.1　為什麼說測試很睏難　　69
5.2　需要測試的重點瀏覽器　　69
5.3　瀏覽器市場份額　　70
5.4　測試多個瀏覽器　　72
5.4.1　iOS係統的Safari瀏覽器　　72
5.4.2　安卓　　74
5.5　測試老式瀏覽器　　75
5.5.1　Internet Explorer和Microsoft Edge　　75
5.5.2　Firefox瀏覽器　　76
5.5.3　Safari和iOS係統的Safari　　76
5.5.4　Chrome瀏覽器　　76
5.6　測試最新版本的瀏覽器　　77
5.7　第三方測試服務　　77
5.8　用開發者工具測試　　77
5.8.1　模擬設備尺寸　　78
5.8.2　文檔對象模型（DOM）和CSS樣式　　81
5.9　視覺迴歸測試　　82
5.9.1　視覺迴歸測試技巧　　83
5.9.2　用Gemini執行視覺迴歸測試　　83
5.10　維護你的代碼　　87
5.10.1　編碼規範　　87
5.10.2　模式庫　　91
5.11　總結　　94
第6章　代碼的組織和重構策略　　95
6.1　按照樣式從最不精確到最精確組織CSS　　95
6.1.1　通用樣式　　96
6.1.2　基礎樣式　　96
6.1.3　組件及其容器的樣式　　96
6.1.4　結構化樣式　　96
6.1.5　功能性樣式　　96
6.1.6　瀏覽器特定樣式　　96
6.2　多個文件還是一個大文件　　97
6.2.1　提供CSS　　97
6.2.2　用單一的CSS文件進行開發　　99
6.2.3　用多個CSS文件進行開發　　100
6.3　重構前審查CSS　　100
6.4　重構策略　　102
6.4.1　保持規則集結構的一緻性　　102
6.4.2　刪除僵屍代碼　　102
6.4.3　分離CSS和JavaScript　　103
6.4.4　分離基礎樣式　　104
6.4.5　刪除冗餘的ID　　106
6.4.6　將ID轉化為類　　106
6.4.7　區分功能性樣式　　107
6.4.8　定義可復用組件　　107
6.4.9　刪除行內CSS和過於模塊化的類　　108
6.4.10　隔離麵嚮特定瀏覽器的CSS樣式　　108
6.5　評估重構是否成功　　108
6.5.1　你的網站崩潰瞭嗎　　109
6.5.2　UI bug數　　109
6.5.3　減少開發和測試時間　　109
6.6 總結　　110
附錄 normalize.css　　111
作者簡介　　120
封麵說明　　120
· · · · · · (收起)