提问人：Ande Hofer 提问时间：7/14/2020 最后编辑：KukeltjeAnde Hofer 更新时间：8/14/2020 访问量：1309
如何将 PrimeIcons 与自定义或“无”主题一起使用
How to use PrimeIcons with a custom or 'none' theme
问：
我将一个小应用程序从 JSF 1.2 RF 3.3.3 迁移到 JSF 2.1 和 PF 7.0。（2.1 的原因是 JBoss EAP 6.1 只允许 java 7）
外观不应该改变，所以我没有使用主题（web.xml 中的主题没有）。大多数问题都可以用一些CSS解决，但是对于p：dataTable，我需要排序图标，theme=none不存在。
有没有办法在不向应用程序添加一些图标的情况下使用一些默认的 primefaces 排序图标？如果是，我该如何使用它？我用 PrimeIcons 尝试了一些东西，但没有让它工作。
答：
4赞
Jasper de Vries
7/14/2020
#1
这些图标与 PrimeFaces 捆绑在一起，您可以手动加载，如下所示：
<h:outputStylesheet library="primefaces" name="primeicons/primeicons.css" />
这将允许您使用以下图标：
<i class="pi pi-xxx"></i>
但这不是PrimeFaces组件使用的。这些组件基于 jQuery UI 图标，因此类如 .因此，您需要创建一个自定义样式表来处理 UI 图标。您不需要从头开始，因为您可以在（例如）Nova Light 主题中找到所有这些。ui-icon ui-icon-xxx
在上面链接的主题中，找到包含的所有规则，尤其是以下规则：.ui-icon
.ui-icon-xxx:before {
content: "...";
}
(content定义使用 PrimeIcons 字体中的哪个字形），然后合并到样式表中。不幸的是，没有可以复制和粘贴的部分，因此这将是一项艰巨的任务。
评论
0赞
Ande Hofer
7/14/2020
谢谢，我从您引用的 css 文件中复制了所有带有 ui-sortable-column-icon 的内容，现在它正在工作。似乎问题在于我对内容属性的不理解。
1赞
Kukeltje
7/14/2020
@JasperDeVries：使用 grep 无法从 css 中快速提取所有与图标相关的信息吗？认为它会...我明天会尝试（如果我不忘记的话），如果我成功了，我会把它添加到你的答案中
评论