Jsf 如何在Primefaces组件中使用材质图标

如何在Primefaces组件中使用，例如：

使用前缀为

“ui图标-

的图标属性定义。 因为，在“材质图标”网站上，只能使用以下方式：

<span class="material-icons-outlined">face</span>

面

---

显示了一个转换选项，调整，我想知道如何做到这一点。

通过查看Saphire的源代码，您需要使用CSS，这样可以覆盖

ui图标

等

资料来源：

声明字体：

@font-face{
字体系列：“材质图标”；
字体风格：普通；
字体大小：400；
src:url（“/sapphire/javax.faces.resource/fonts/MaterialIcons Regular.eot.xhtml？ln=sapphire布局”）；
/*对于IE6-8*/
src:local（“材质图标”）、local（“MaterialIcons常规”）、url（“/sapphire/javax.faces.resource/fonts/MaterialIcons常规.woff2.xhtml？ln=sapphire布局”）格式（“woff2”）、url（“/sapphire/javax.faces.resource/fonts/MaterialIcons常规.woff.xhtml？ln=sapphire布局”）格式（“woff”）、url（“/sapphire/javax.faces.resource/font/MaterialIcons Regular.ttf.xhtml？ln=sapphire布局）格式（“truetype”）；
}

覆盖

ui图标

body.ui图标{
字体系列：“材质图标”；
字体大小：正常；
字体风格：普通；
字体大小：20px；
显示：内联块；
宽度：20px；
高度：20px；
线高：1；
文本转换：无；
字母间距：正常；
换字：正常；
空白：nowrap；
方向：ltr；
文本缩进：0；
溢出：可见；
/*支持所有WebKit浏览器*/
-webkit字体平滑：抗锯齿；
/*支持Safari和Chrome*/
文本呈现：优化易读性；
/*对Firefox的支持*/
-moz osx字体平滑：灰度；
/*支持IE*/
字体功能设置：“liga”；
}
主体。材质图标{
字体系列：“材质图标”；
字体大小：正常；
字体风格：普通；
字体大小：24px；
/*首选图标大小*/
显示：内联块；
宽度：1米；
高度：1米；
线高：1；
文本转换：无；
字母间距：正常；
换字：正常；
空白：nowrap；
方向：ltr；
/*支持所有WebKit浏览器*/
-webkit字体平滑：抗锯齿；
/*支持Safari和Chrome*/
文本呈现：优化易读性；
/*对Firefox的支持*/
-moz osx字体平滑：灰度；
/*支持IE*/
字体功能设置：“liga”；
}

然后在主题的底部，所有的ui图标都是这样的

.ui-icon-circle-triangle-e:在{content:}之前"; }