Kendo ui 在剑道面板栏中使用字体Awesome显示SpriteClass

我在剑道面板栏中显示

时遇到问题，因为它只使用

和

是否可以在剑道面板栏中使用字体真棒

用于显示的代码

带精灵的PanelBar
$（“#panelbar sprites”）。kendoPanelBar({
数据源：[{
文字：“巴西”，精神类：“巴西国旗”，项目：[
{文本：“历史”，精神分类：“历史分类”}，
{文本：“地理”，精灵类：“地理图标”}
]
},
{
文字：“印度”，精神类：“印度”，项目：[
{文本：“历史”，精神分类：“历史分类”}，
{文本：“地理”，精灵类：“地理图标”}
]
},
{
正文：“荷兰”，精神类：“荷兰”，项目：[
{文本：“历史”，精神分类：“历史分类”}，
{文本：“地理”，精灵类：“地理图标”}
]
}]
});

下面是一个使用随机字体的dojo示例

您所需要做的就是包含字体awesome css（本地或来自cdn），然后使用字体awesome命名约定，例如

fa-fa-circle-stop

等，它将作为标题的一部分包含在内

我假设您提供的示例来自演示站点，如果您再往下看（在css声明部分），您将看到它加载了一个sprite文件，然后对标志的图像进行绝对定位

---

如果你需要更多的信息，请告诉我

嗨！它仍然会显示为框，当然它仍然使用

。。但无论何时我将其更改为

（在inspect元素中），图标都将显示HI@大卫，谢谢，我已经知道了。我的css中有一个错误，metroui将覆盖字体

<div class="demo-section k-content">

            <h4>PanelBar with sprites</h4>

            <div id="panelbar-sprites"></div>

        </div>

        <script>
            $("#panelbar-sprites").kendoPanelBar({
                dataSource: [{
                        text: "Brazil", spriteCssClass: "brazilFlag", items: [
                            { text: "History", spriteCssClass: "historyIcon" },
                            { text: "Geography", spriteCssClass: "geographyIcon" }
                        ]
                    },
                    {
                        text: "India", spriteCssClass: "indiaFlag", items: [
                            { text: "History", spriteCssClass: "historyIcon" },
                            { text: "Geography", spriteCssClass: "geographyIcon" }
                        ]
                    },
                    {
                        text: "Netherlands", spriteCssClass: "netherlandsFlag", items: [
                            { text: "History", spriteCssClass: "historyIcon" },
                            { text: "Geography", spriteCssClass: "geographyIcon" }
                        ]
                    }]
            });
        </script>