Css 如何在primefaces中创建自定义图标

我想创建一个新图标以在我的

p:commandButton

中使用，但我使用此方法失败了

但这对我不起作用。我将向您展示我的代码：

CSS代码：

.img-button-help { background-image: url('img/mag.ico') !important; }

jsf代码：

<p:commandButton icon="img-button-help" value="test" />

结果: 新结果->

---

如何在Primefaces中使用自定义图标？？？

您好，您可以尝试将

背景位置添加到css中，因为Primefaces图像基于精灵，而
.img按钮帮助所做的是设置一个位置。试试这个：

.img-button-help { 
   background-image: url('img/mag.ico') !important;  
   background-position: center !important;
}

我在Danko的著作中找到了解决这个问题的方法。我创建了一个小图标，并把它作为背景放在左边

<p:commandButton value="test" style=" padding-left: 15px;background-image: url('img/mag.ico') !important;background-repeat: no-repeat;background-position: left;" />



现在我使用primefaces图标将其作为图标。
看起来没有找到图像，因此没有可显示的图标。使用安装了Firebug的Chrome或Firefox，按F12键，查看是否可以访问资源部分中的此图标。我认为该图像已建立，但未显示或改编为p:CommandButton。是否确实找到该图像？您是否验证了是否可以从您的站点访问？验证它的一种方法是使用我在上面的评论中解释的方法。这是Chrome的文档：我没有在google bug的图像文件夹中找到它，但是当我在google中写下我知道的url时，我可以看到图像。然后问题是图像没有找到（正如我猜的那样）。如果您将所有资源都放在
resources
文件夹中会更好，如下所述：不起作用我有一个像我发布的图像一样的空白位置。请尝试在PX中设置位置，以便更好地使用css样式