Question

我想在p：commandButton上显示图像，我尝试了很多方法，但无法在按钮上显示图像。下面是我包含的代码： css代码：

.ui-icon-myCancel{
    background-image: url("#{resources['images/cancel.jpg']}") !important;
}


 <p:commandButton icon="ui-icon-myCancel" action="#{cancelMB.cancelList}" update="dataInfo" ajax="true"/>

我在 WebContent \ resources \ images \ cancel.jpg

下有图像

另一种方法我尝试修改css代码如下，但仍然没有运气：

.ui-icon-myCancel{
       background-image: url(resources/images/cancel.jpg) no-repeat top left !important;
}

其他方式：

.ui-icon-myCancel{
       background-image: url(resources/images/cancel.jpg)
}

请建议，哪里出错了。

Answer 1

另一种解决方案是放弃 CSS使用，并依赖额外的嵌套标记＆＃34; graphicImage＆＃34;内部不是commandButton，而是commandLink代替：

<p:commandLink action="#{cancelMB.cancelList}" update="dataInfo" ajax="true" >
     <h:graphicImage name="images/cancel.jpg" title="Cancel" />
</p:commandLink>

p：commandButton上无法看到图像

1 个答案: