css - JSF commandLink with image

Question

に問題があり<p:commandLink>ます。<p:graphicImage>ホバー効果を作りたいのですが、CSS経由で画像を読み込めません。

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>

境界線のある空の長方形が表示されます。

しかし、graphicImage に alt を追加すると、alt からテキストの上に画像が表示されます...

私の間違いはどこですか？ありがとうございました。ps 入力エラー - classType -> styleClass

score 6 · Accepted Answer

代わりにstyleClassを使用してみてください<h:graphicImage>

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

このクラスを試す

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

ところで

画像であるべきではないですか？または画像（フォルダ名）

これも見てください..画像付きのcommandButtonが必要な場合: PrimeFacesアイコン

score 2 · Accepted Answer

使わない理由

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

そしてcssで

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

2 に答える 2