JQGRID：如何让复选框适配行高（含表头）

直接CSS解决方案 #

针对网格主体的复选框，添加以下样式即可让它适配60px的行高：

/* 适配网格主体60px行高的复选框 */
.ui-jqgrid tr.jqgrow td input[type="checkbox"] {
    width: 24px; /* 尺寸可根据行高调整，24px与60px行高视觉协调 */
    height: 24px;
    vertical-align: middle; /* 让复选框在高行高中垂直居中 */
    margin: 0; /* 清除默认边距避免偏移 */
}

/* 若需表头复选框统一风格，可补充此规则（整合原方案） */
.ui-jqgrid .ui-jqgrid-labels th input[type="checkbox"] {
    width: 24px;
    height: 24px;
    vertical-align: middle;
}

关键说明 #

• 复选框的宽高可根据实际需求微调，保证和60px行高比例协调即可
• vertical-align: middle能避免复选框在高行高中出现上下偏移的情况
• 清除默认margin是为了消除复选框与单元格边缘的多余间距

内容的提问来源于stack exchange，提问作者Nico44044