Question

我想更改<p:rowEditor>中的图标。不是ui-icon-pencil，而是ui-icon-check和ui-icon-close。

我的CSS

.ui-icon-check {
    background-image: url(../images/success_icon_16x16.png) !important; 
}
.ui-icon-close {
    background-image: url(../images/cancel.png) !important;
}

但是当我编辑某些行时，我看不到任何图标。

有什么想法吗？蒂姆蒂姆

Answer 1

这可能是因为您的CSS类没有覆盖jQuery UI css样式表。这是因为在声明jQuery UI样式表之前，样式表被放置在<head>标记中。

基本上，jQuery UI样式表会覆盖样式表。

确保样式表覆盖其他声明样式的最简单方法是将样式表放在<h:body>中。除非<h:outputStylesheet>上有一些属性允许你订购它在文档中的呈现方式，而不是JSF的新版本中的其他`对象，所以这是我能想到的唯一方法。 / p>

Answer 2

我有类似的问题，我可以覆盖除铅笔图标以外的所有内容，检查并关闭。我的问题是高度和宽度。所以我不得不重写它。

 .ui-icon-pencil {
  background-image: url(../images/pencil.png) !important;
  height: 20px;
  width:20px;
 }

Primefaces从p：rowEditor更改图标

2 个答案: