我經歷過許多 css **的除錯工作，有別人寫的也有自己寫的，有移動端平台的也有標準桌面瀏覽器的，從陳舊的 ie 到最新的基於 webkit 的每日構建。經驗告訴我，很多人並沒有乙個標準的 css 除錯流程。
我發現在大多數情況下，擁有專業的解決問題的方法，能夠節省花在 bug 上的時間。
下面是我總結的經驗。
我不保證這是最適合的除錯 css 的方法，但是確實對我很有效。如何 css 不是你的主要程式語言，除錯它可能就像暗黑藝術一樣；遵循下面的指南能夠幫助你更有效地定位和解決 bug。
概括地說，我把除錯流程分為 3 個階段：
評估並快速修復
還原和重現
定位根源並修復
我們挨個解釋每個階段並實踐乙個例子。for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
for=」」 class=」item」>hello
對應的 css 是：
.outer
.inner
.item
outer 的寬度會是多少？如果你認為是 max-width 的 400px，我會原諒你的。但是不是我們看到的寬度，看 ben frain 編寫的 codepen。
什麼情況？為什麼不是 max-width 的值？給你個思路，開啟 computed styles 面板。
找到問題的根源了嗎？
我來給你解釋下。預設地，fieldset 元素的寬度會等於其內容的寬度。在 chrome 的computed styles 面板中，min-width 的值是乙個新的 min-content。
給 min-width 設定乙個新值來「修復」它。這個例子中，min-width: 0 就會讓 max-width 按照我們期望的那樣進行工作。
這正是開發者工具的 computed styles 面板中看到的值。記住你寫的**不一定是瀏覽器計算後的。
討論 頁面出現異常的原因可能很多並且不盡相同。不同瀏覽器對規範的實現存在差異是普遍存在的現象。相比於編寫乙個瘋狂的瀏覽器 bug 目錄，解決問題的最有效流程還是始終保持條理性。總結來看有效的措施包括：
評估 bug，執行快速修復
使用最少的**重現問題
利用工具和 bug 追蹤描述原因
使用更靈活的**修復問題，或者使用注釋過的hack手段，亦或拷貝副本修復
本地除錯HTML和CSS的方法
在本地除錯html和css 時，每次更改完需要清除瀏覽器快取，才能看到更改的效果，否則直 起來就像是css檔案引入失效一樣，在網上查詢後，找到以下兩種方法 像個谷歌開發者一樣工作 先把當前的html和css載入，用chrome開啟，按f12，在elements這裡顯示的是html 頁面下方是css ...
HVM的除錯方法
概述 hvm的除錯必須平衡兩個因素 簡單與高速程式執行的執行開發需求 在除錯過程中，快速的除錯與監測資料平台至關重要。對於並行程式來說，這種情況尤為突出。在進行序列程式的開發時，簡單的資料跟蹤與除錯可通過單步跟蹤進行簡單的錯誤修改。在並行程式中，由於互斥與記憶體共享的存在，開發與除錯變得不那麼輕鬆。...
啟動除錯的方法
第一種 在專案屬性中啟用除錯。在visual studio 2005 中，通過執行下列操作，使用 屬性頁 設定專案屬性，以便進行web 應用程式除錯 1.通過在 解決方案資源管理器 中右擊專案名稱，並選擇 屬性頁 開啟 屬性頁 2.單擊 啟動選項 選項卡。3.在 偵錯程式 下，確保 asp.net ...