删除jqGrid中的垂直线 [英] Remove vertical lines in jqGrid

问题描述

我要删除演示了应用所有上述CSS样式的结果： / p>

>

I want to remove the lines displayed in the image of jqGrid. How can I remove that?

解决方案

jqGrid builds some additional divs over the main grid table. The outer div has the class ui-jqgrid. So if you need to remove right and left border existing over the whole grid you can use the following CSS:

.ui-jqgrid { border-right-width: 0px; border-left-width: 0px; }

If you need to remove all grid's borders you can use

.ui-jqgrid { border-width: 0px; }

If you want additionally remove vertical border between the cells in the grid you can use

.ui-jqgrid tr.ui-row-ltr td { border-right-color: transparent; }

To remove horizontal border between the rows you can use

.ui-jqgrid tr.ui-row-ltr td { border-bottom-color: transparent; }

To remove vertical borders between the column headers you can use

th.ui-th-column { border-right-color: transparent !important }

or alternatively (without the usage of !important)

.ui-jqgrid-labels .ui-th-column { border-right-color: transparent }

(See the old answer)

So you can choose the styles which you need depend on your exact requirements. The demo demonstrate the results on applying of all above CSS styles:

这篇关于删除jqGrid中的垂直线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！