为每列自定义GridView列边框

时间:2011-03-07 19:06:14

标签: asp.net gridview coding-style border

我有几列,我希望在左边和右边有这样的边框:

| column1 column2 | column3 column4 |

如果我在ItemStyle中指定边框,则会在两侧显示边框,并且不会在第1列和第2列以及第3列和第4列之间显示列。

有什么建议吗?

2 个答案:

答案 0 :(得分:5)

在CSS中创建一个样式,如:

<style type="text/css">
    td.column_style_left
    {
        border-left: 1px solid black;
    }    
    td.column_style_right
    {
        border-right: 1px solid black;
    }    
</style>

然后将其分配给TemplateField

<asp:TemplateField>
    <ItemStyle CssClass="column_style_left" />
    <ItemTemplate>
        <!-- whatever you want here -->
    </ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
    <ItemStyle CssClass="column_style_right" />
    <ItemTemplate>
        <!-- whatever you want here -->
    </ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
    <ItemTemplate>
        <!-- whatever you want here -->
    </ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
    <ItemStyle CssClass="column_style_right" />
    <ItemTemplate>
        <!-- whatever you want here -->
    </ItemTemplate>
</asp:TemplateField>

将产生:

| column1 column2 | column3 column4 |

您可以更改样式以匹配您需要的样式,例如右侧,左侧或顶部等......

为每个不同的列创建一个独特的样式。

答案 1 :(得分:0)

你可以试试像

这样的风格
  table td:nth-child(2n) {
        padding:2px 8px;
        border-right:1px solid black;
    }

查看this example