如何将样式添加到 MVC 视图验证？答案

【问题标题】：How to add style to a MVC View validation?如何将样式添加到 MVC 视图验证？
【发布时间】：2015-11-05 22:40:57
【问题描述】：

我是 MVC 的初学者，我想设置 MVC 验证的样式，我该怎么做？

<div class="col-md-6">
    @Html.ListBoxFor(a => a.QRefIds, new MultiSelectList(ViewBag.QltyRfs, "QReferenceId", "QReferenceCode"), new { Class = "form-control", title = "Select Feeder List", style = "width:575px;height:50px; margin-top:6px;font-size:small;" })
    @Html.ValidationMessageFor(a => a.QRefIds)
</div>

【问题讨论】：

我相信它会输出一个带有类错误（或类似的东西）的跨度如果你inspect the HTML你应该能够明白我的意思
@Html.ValidationMessageFor() 使用 class="field-validation-valid" 或 class="field-validation-error" 生成 <span>，因此您可以使用 css 根据类名对其进行样式化
感谢帮助，明白了 .field-validation-error { color: red;字体大小：10.5px；字体系列：Arial、Helvetica、sans-serif；字体粗细：粗体； }
这可能会有所帮助：developmentpassion.blogspot.de/2015/10/…
这个链接对于你想做的简单事情来说是太多不必要的工作了。

标签： css asp.net-mvc

【解决方案1】：

验证助手生成一堆 span 类 field-validation-error 您可以使用 CSS 更改它：

.field-validation-error {

   background-color:white;

   border-radius:4px;

   border: solid 1px #333;

   display: block;

   position: absolute;

   top:0; right:0; left:0;

   text-align:right;

}

当输入出现验证错误时，您还可以设置 input-validation-error 样式：

.input-validation-error{ background: pink; border: 1px solid red; }

【讨论】：