如何使免费的jqrid字体真棒动作按钮更大

使用带有字体真棒图标集的免费jqgrid 4.8。

标准操作按钮使用colmodel定义

[{"name":"_actions","search":false,"width":(37+15)+45 ,"sortable":false,"formatter":"actions","viewable":false,"formatoptions":{"editbutton":true,"keys":true ,"delbutton":true}] 

使用代码添加其他按钮

如何在jqgrid中的动作按钮之前添加按钮

但即使在此代码中使用了字体真棒类，它们也会显示为jquery ui按钮。

使用JQgrid设置行高的代码增加jqgrid行高

 .ui-jqgrid tr.jqgrow td { height: 2.8em !important; } 

但内联格式化程序操作按钮对于平板电脑来说太小了。

工具栏按钮大小增加使用

 .ui-jqgrid .ui-jqgrid-toppager .ui-pg-div > span { font-size: 20px; } 

从如何使jqgrid顶部工具栏自定义按钮更像标准按钮，但这不会影响内联操作按钮。

我试着用

 .ui-icon { zoom: 1.5; } 

但这只会改变jquery ui动作按钮。

如果使用字体真棒，如何增加内联操作按钮的大小？ 如何使用自定义jquery ui动作按钮的字体真棒图标按钮？

Answer 1

您可以通过多种方式解决问题。 例如，您可以添加如下所示的CSS规则

 .jqgrow .ui-jqgrid-actions > .ui-pg-div > span { font-size: 24px; } 

要么

 .jqgrow .ui-pg-div > span.fa { font-size: 24px; } 

该演示演示了结果。 它另外使用另一个width值作为默认值

 { name: "act", template: "actions", width: 72 }