Question

我在Kendo Panel Bar中显示<i>时遇到问题，因为它只使用<span>和<img>

是否可以在Kendo Panel Bar中使用Font Awesome？

显示<span>

的代码

<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>

Answer 1

这是一个使用随机字体真棒精灵example dojo

的dojo示例

您需要做的就是包括字体真棒css（本地或cdn），然后使用字体真棒命名约定，例如fa fa-circle-stop等它将作为标题的一部分包含在内。

您提供的示例我假设来自演示站点，如果您向下看（在css声明部分中），您将看到它加载精灵文件然后绝对定位图像的标志。

如果您需要更多信息，请告知我们。

在Kendo Panel Bar中使用Font-Awesome显示SpriteClass

1 个答案: