Changing Hyperlink Color, Place In GridView Control

I still remember my time when I have used the hyperlink control in the grid view control, and the default look of the hyper link control look very bad as I have change the look of the grid view control. Now I have decided to share my that experience with you and here is my default page. here you can see that hyper link control didn't look nice in the grid view control.

Here is the the output , which I want to achieve, mean no blue color and not underline text of the hyper link. To achieve this there are two ways , One is to format the hyper link control in the grid view, and second one is through Css.

First Way:

In the first way you have to set the hyper link control properties in HyperLinkField tag, I have set the font underline and for color properties of the hyper link field and also the font bold to false. Below is the code for you.

<asp:HyperLinkField DataNavigateUrlFields="DetailURL" DataTextField="OrderDetail"  ControlStyle-Font-Underline ="false" ControlStyle-ForeColor="black"  ControlStyle-Font-Bold="false" />

Second Way:

Here is the css if you don't want to do the setting of the hyper link field in the html. Here you have to set the font-weight and color and also the text decoration properties of the a tag as we know that grid view control generate html table, So I have used that notation to search the a tag in the table.

table tr td a
{
cursor: hand;
font-size: 8pt;
font-family: Segoe UI;
font-weight: normal;
color:Black;
text-decoration:none;
}

Hope you get some idea from above two ways. Both of the above ways are equal you can use any of the above.You can download the source code from here

All and any comments / bugs / suggestions are welcomed!