带图像的JSF commandLink

Question

我对<p:commandLink>有疑问。我想制作悬停效果但我无法通过CSS将图像加载到<p:graphicImage>。

CSS：

.accountEditBtn {
    background-image:
    url('#{request.contextPath}/resources/image/pencil_black.png');
}

JSF：

<p:commandLink
    update="@form"
    actionListener="#{someBean.someListener}">
    <h:graphicImage styleClass="accountEditBtn" />
</p:commandLink>

我看到带边框的空矩形。

但是当我将alt添加到graphicImage时，我会从alt ...

获取图像

我的错误在哪里？ 谢谢。 附：输入错误 - classType - ＆gt;的styleClass

Answer 1

尝试使用styleClass而不是<h:graphicImage

<p:commandLink 
   styleClass="accountEditBtn"
   update="@form"
   actionListener="#{someBean.someListener}"
</p:commandLink>

试试这个课程

.accountEditBtn { background-image: url('../resources/image/pencil_black.png'); }

B.T.W

是不应该是图像？或者是图像（文件夹名称）

看一下这个..如果你想要带有图像的commandButton：PrimeFaces icons

Answer 2

为什么不使用

<p:commandButton ... icon="yourbuttonstyleclass"/>

和css

.yourbuttonstyleclass {  
background-image: url('../images/yourimage.png') !important;
}