Telerik Kendo 网格自定义命令图标

Question

我在我的应用程序中使用 kendo 网格，每一行都有自定义命令，如下所示：

.Columns(
        columns =>
        {
           //fields 1
           //fields 2
            columns.Command(command =>
            {
                command.Custom("View").Click("view");
                command.Custom("Edit").Click("edit");
                command.Custom("Delete").Click("delete");
            }).Width(300);
        }
)

它可以工作，但现在我需要放置图标（很棒的字体？）而不是字符串。谢谢你的帮助

Answer 1

您可以使用 CSS 自定义按钮的外观和喜好。在以下示例中，按钮使用背景图像进行自定义。

.k-grid-content .k-button {
  width: 20px;
  height: 20px;
  border: none;
  min-width: 0 !important;
  border-radius: 0;
  color: transparent;
  text-indent: -10000%;
  box-shadow: none !important;
}

.k-grid-content .k-button span {
   display: none;
 }

.k-grid-content .k-button.k-grid-Edit {
  background: url(/img/icons/icon-edit.png) no-repeat;
}

我为你创建了一个道场。希望对你有帮助。

http://dojo.telerik.com/ETIYa/2

Telerik Kendo 网格自定义命令图标

Telerik Kendo Grid custom command icon

asp.net-mvc

telerik

font-awesome

kendo-grid