用於選擇的CSS標識和用於樣式的類

Question

我正在使用驗證編寫表單，並且我想在未正確填充文本框時突出顯示文本框。我加入這個CSS規則：

/*Styles for validation*/ 
.invalid { 
    border: 1px solid #FF0000; 
} 

在我的窗體中的字段有ID，比如#f1第一場，其中有沒有CSS樣式，但我使用他們選擇使用jQuery的字段。所以，當我發現一個錯誤我說：

$('#f1').addClass("invalid"); 

根據Firefox的檢查，該元素現在有風格＃f1.invalid，但我沒有看到任何應用到元素無效的造型。我如何獲得我正在尋找的行爲？謝謝！

編輯：我撒謊了，還有我的文本字段內聯樣式，設置寬度5ems，但去除它似乎不有所作爲

Answer 1

原來我的CSS或我的HTML沒有錯。我的FTP客戶端沒有上傳我的更改到.css文件。注意緩存的臨時文件的危險！

Answer 2

一個選擇具有匹配的ID比具有匹配類別的選擇器更強。這意味着如果您的規則設置爲邊框對於ID#f1的元素，則不應用該類的規則。爲了使課程成爲可能，你需要告訴它它更重要。

.invalid { 
    border: 1px solid #FF0000 !important; 
}