Question

我正在尝试将图像/图标放在Primefaces中的按钮内，问题是图像没有显示。我使用过FireBug，看起来路径是正确的。使用自定义图标有任何问题或限制吗？

XHTML代码：

<p:button type="button" value="Limpiar" icon="img-button-prismaticos" onclick="limpiar  ();return false;"  />

CSS代码：

.ui-state-default .img-button-prismaticos {
    background-image: url('/dinarep/faces/javax.faces.resource/prismaticos-icono-9281-48.png?ln=images') !important;
}

Answer 1

我解决了这个问题。它与图像在按钮上的跨度大小有关。只有16x16！我修复了CSS中跨度的大小和边距。我用的很重要！破解CSS因为我不想覆盖默认的Primefaces样式。我希望我的利润更优先。

.img-button-nube {
    background-image: url('/dinarep/faces/javax.faces.resource/nubes-icono.png?ln=images') !important;
    height: 28px;
    width: 28px;
    left: 0 !important;
    margin-left: 0 !important;
    top: 0 !important;
    margin-top: 0 !important;
}

和XHTML（无变化）：

<p:button type="button" icon="img-button-nube" onclick="nubes();return false;"  />

这对我有用......

由于

Answer 2

在没有.ui-state-default

的情况下尝试此操作

.img-button-prismaticos { background-image：url（'/ dinarep / faces / javax.faces.resource / prismaticos-icono-9281-48.png？ln = images'）！important; }

最好

VJ

PrimeFaces按钮中的自定义图标不起作用

2 个答案: