In this article I will show an easy way to set and change the color of GridLines in ASP.Net GridView using pure CSS and not through coding.
This is a cross browser solution and will work in all the major browsers like IE, Firefox, Chrome and Safari. Using the same CSS style you can also change the border width of the GridLines in ASP.Net GridView.
 
HTML Markup
The HTML Markup consists of an ASP.Net GridView with three columns. For the GridView I have specified a CssClass property which will be used to change the color of the GridLines later.
<asp:GridView ID="GridView1" CssClass="Grid" runat="server" AutoGenerateColumns="false">
<Columns>
    <asp:BoundField DataField="Id" HeaderText="Id" ItemStyle-Width="30" />
    <asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width="150" />
    <asp:BoundField DataField="Country" HeaderText="Country" ItemStyle-Width="150" />
</Columns>
</asp:GridView>
 
 
 
Namespaces
You will need to import the following namespaces.
C#
using System.Data;
 
VB.Net
Imports System.Data
 
 
Binding the GridView control
I have created a dynamic DataTable with some dummy data and it has been bind to the GridView control in Page Load event.
Note: You can learn more about this technique in my article Create DataTable dynamically and bind to GridView in ASP.Net.
 
C#
protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = new DataTable();
        dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Id", typeof(int)),
                        new DataColumn("Name", typeof(string)),
                        new DataColumn("Country",typeof(string)) });
        dt.Rows.Add(1, "John Hammond", "United States");
        dt.Rows.Add(2, "Mudassar Khan", "India");
        dt.Rows.Add(3, "Suzanne Mathews", "France");
        dt.Rows.Add(4, "Robert Schidner", "Russia");
        GridView1.DataSource = dt;
        GridView1.DataBind();
    }
}
 
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As New DataTable()
        dt.Columns.AddRange(New DataColumn(2) {New DataColumn("Id", GetType(Integer)), New DataColumn("Name", GetType(String)), New DataColumn("Country", GetType(String))})
        dt.Rows.Add(1, "John Hammond", "United States")
        dt.Rows.Add(2, "Mudassar Khan", "India")
        dt.Rows.Add(3, "Suzanne Mathews", "France")
        dt.Rows.Add(4, "Robert Schidner", "Russia")
        GridView1.DataSource = dt
        GridView1.DataBind()
    End If
End Sub
 
 
Change (set) color of GridLines color of ASP.Net GridView
You need to place the following CSS style to the HEAD or BODY section of the page.
<style type="text/css">
body
{
    font-family: Arial;
    font-size: 10pt;
}
.Grid th
{
    color: #fff;
    background-color: #3AC0F2;
}
/* CSS to change the GridLines color */
.Grid, .Grid th, .Grid td
{
    border:1px solid #fff000;
}
</style>
 
Similar way you can also change the GridLines border width.
Set GridLines color in GridView in ASP.Net
 
Demo
View Demo
 
 
Downloads
Download Code