jquery - 将 jqGrid 行高设置为 23px 以下

Question

我知道这里有关于如何设置行高的问题。我已经阅读了他们并按照他们的建议做了，但他们都没有真正解决我想要解决的问题。我的用户希望一次在网格上查看更多数据。因此，我尝试将行高更改为 15px。

jqGrid 忽略任何低于 23px 的行高。当传入的高度值为 23 或更大时，以下代码有效：

self.grid.setRowData(row[self.keyColumn], false, { height: cssRowHeight });

再低一点，对 html 的检查显示该行的高度为 21px，顶部和底部有 1px 的边框。

所以我的问题是，如何将 jqGrid 行高设置为低于 23px 的值？

谢谢，杰罗姆

score 5 · Accepted Answer

这是个好问题！我认为这对其他用户来说会很有趣。

查看显示的演示

在此处输入图像描述

我使用了以下 CSS：

.ui-jqgrid tr.jqgrow td { height: 15px; }

确切的结果可能取决于您使用的其他格式器。例如，列formatter: 'checkbox'可见的相同网格（请参见此处）看起来，尤其是在 IE 中，不是那么紧凑：

在此处输入图像描述

它在任何方面都比原始网格更紧凑（参见演示）：

在此处输入图像描述

例如，如果您需要减小具有组合框的行的大小，则必须使用其他 CSS，例如

.ui-jqgrid tr.jqgrow td { height: 15px; padding-top: 0px;}
.ui-jqgrid tr.jqgrow td input { padding: 0px; height: 11px; width: 11px; }

score 1 · Accepted Answer

在您的 jQGrid 文件中添加以下 css 样式作为样式标记之间的内部样式

<style>
.ui-jqgrid tr.jqgrow td{height:40px;}
</style>

2 回答 2