Chrome DevTools CSS 樣式刪除線含義與覆蓋技巧

刪除線含義

在 Elements 面板 Styles 欄中，樣式前出現 刪除線（橫槓） 表示該聲明被其他優先級更高的規則覆蓋，當前不生效。

強制生效方法

在屬性值後添加 !important：

.my-class {
    color: red !important; /* 鎖定優先級，除非同樣 !important 且後聲明 */
}

調試建議

• 點擊刪除線樣式右側的文件名：行號，跳轉到來源定位覆蓋規則。
• 檢查選擇器權重、內聯樣式、!important 使用情況。
• 善用 Computed 面板查看最終生效值與來源。