Ext-JSQuicktipIconCSS问题-Ext-JSQuicktipIconCSSQuestion

0  

You could use the cls configuration property to attach a custom CSS class to each of the components whose invalid icons you want to change, and then add a rule to your CSS stylesheet along these lines:

您可以使用cls配置属性将自定义CSS类附加到要更改其无效图标的每个组件，然后沿着以下行向CSS样式表添加规则：

.your-special-class .x-form-invalid-msg
{
   background-image: url("../my-images/my-warning.gif");
}

The textfields would look like this:

文本字段看起来像这样：

items: [{
  // ...
  vtype: "yourVType",
  cls: "your-special-class",
  // ...
}, {
  // ...
  vtype: "yourVType",
  cls: "your-special-class",
  // ...
}, {
  // Some other textfield with no special vtype or cls properties.
}]

The end result is this:

最终结果如下：

• Each of your special text fields includes "your-special-class" in the class attribute of the DIV that contains both the textfield and its (normally hidden) invalid contents message.
• 每个特殊文本字段在DIV的class属性中包含“your-special-class”，其中包含textfield及其（通常隐藏的）无效内容消息。
• When the invalid message is shown, the CSS selector above applies to it more specifically than the simple .x-form-invalid-msg selector in Ext's CSS stylesheet because it specifies both the class of the invalid message element itself as well as the class of the DIV that contains it.
• 当显示无效消息时，上面的CSS选择器比Ext的CSS样式表中的简单.x-form-invalid-msg选择器更具体地应用它，因为它指定了无效消息元素本身的类以及类包含它的DIV。
• Being more specific, the background-image attribute specified in your CSS rule overrides its counterpart in the Ext stylesheet, so that your background image is now used instead of the one from the Ext default theme.
• 更具体地说，CSS规则中指定的background-image属性会覆盖Ext样式表中的对应属性，以便现在使用背景图像而不是Ext默认主题中的背景图像。