未能在验证错误中应用样式

Question

我正在学习asp.net mvc 5.我正在尝试设置验证错误，但是我失败了。这是CSS（在Style.css文件中）应该为validation errors设置样式。

.field-validation-error {
    color: red;
}

.input-validation-error {
    border: 2px solid red;
}

以下是我使用razor语法创建验证消息的方法：

@Html.ValidationMessageFor(m => m.Customer.Name)

但这是我得到的结果：

正如您所看到的，验证错误中未应用任何样式。

我在stackoverflow中发现了一些问题，但是没有一个解决方案真正帮助了我。谢谢！

Answer 1

我们可以使用！important 属性覆盖默认css。例如，

.field-validation-error {
  color: red !important;
 }
.input-validation-error {
  border: 2px solid red !important;
 }

希望有所帮助：）

Answer 2

虽然用!important覆盖css规则会起作用，但我建议不要使用它，因为在将来需要它时几乎不可能覆盖这些样式。

而是创建一个自定义css类（例如my-validation-error）并添加以下css规则：

.field-validation-error.my-validation-error {
  color: red;
}

然后在验证消息helper中使用此类：

@Html.ValidationMessageFor(m => m.Customer.Name,  new { @class ="my-validation-error"})