带背景色和图像的验证消息样式

Question

我正在尝试修复与ASP.NET MVC 3验证及其CSS相关的设计问题。我明白MVC有一些默认的css类用于验证消息的使用，如果你需要自定义样式，你可以简单地根据你的需求更新这些类。

现在这里的问题似乎是我的要求，我们的设计团队提出了验证消息显示，如果缺少必填字段，那么错误消息应该有一个指向输入控件的“箭头图像” 。下面是铺陈，我想在这里实现：

现在，我想弄清楚的事情是我怎么能排列的红色背景颜色和旁边的消息图像。

任何建议/帮助将深表谢意。

Answer 1

您可以使用此HTML结构显示错误味精

<div class="error"> 
    <span>error message</span> 
</div> 

CSS

.error{background:url(arrow.gif) no-repeat left center; padding-left:15px;} 
.error span{ padding:2px; background:red;}