CSS类不会覆盖border-style

Question

我用灰色边框设置了所有文本字段的样式,对于字段class="form_field_error",我希望边框颜色更改为红色.

我尝试了以下代码,但我不能让我的类覆盖以前定义的边框？我错过了什么？

HTML:

<input type="text" name="title" id="title" class="form_field_error">

CSS:

input[type="text"] {
    display: block;
    height: 15px;
    font-weight: normal;
    color: #777;
    padding: 3px;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.form_field_error {
    border: 1px solid #f00;
}

我创建了一个jsFiddle来说明问题.

Answer 1

该input[type="text"]CSS优先于.form_field_errorCSS.

将其更改为input.form_field_error,边框将起作用.

Answer 2

尝试这个：

.form_field_error {
    border: 1px solid #f00 !important;
}