I want to skin my GridView and DetailsView objects so that the command fields (insert, update, cancel) show up as images.

 Within my current skin I tried to add the following lines but had no luck:

CommandField-ButtonType="Image"
CommandField-InsertImageURL="~/Images/foo.jpg"

Any suggestions? 

I use LinkButtons: 

           <ItemTemplate>
                <asp:LinkButton ID="btnSelect" 
                                runat="server" 
                                CausesValidation="False" 
                                OnClick="btnSelect_Click"
                                OnPreRender="btnSelect_PreRender"
                                Tooltip="Select"
                                >
                    <asp:Image  ID="imgbtnSelect" 
                                runat="server" 
                                ImageUrl="../../images/details.gif"
                                />
                </asp:LinkButton>

I understand that I can go in to each gridview and add the code that you have above.  

 
What I'm trying to do is put the same functionality within my .skin file so that I only need to put the code in a single place and it will be inherited by all GridViews with that skin.

In that case, you can use the CssClass and SkinId attributes in the image tag.

 Right, but I would still need to do that for each GridView that I have and for ones that I create.  I want to create a GridView, give it a SkinID of "foobar" and have it automatically set the command line to be images and use the image specified in the skin.

If this is already what you're describing than could you please post the code within the .skin file. 

Here's some stuff on CSS for making buttons:

http://sophie-g.net/jobs/css/e_buttons.htm

http://www.456bereastreet.com/archive/200705/creating_bulletproof_graphic_link_buttons_with_css/

http://forums.asp.net/p/1158166/1907195.aspx

This is an awesome little web utility:

http://www.pagetutor.com/button_designer/index.html

I know what you want - you are probably a little mad at me cause I'm telling you how to skin everything except the entire gridview.  I have a GV class that contains behaviors that get inherited by all the child GVs, but the appearance, no.  I'm generating them all, so if I make changes i change the generator and the changes have to get put in by running the generator again. 

I'm pretty sure though that you can create a CSS class for each individual template field which will make changing appearance across your app easy to maintain; you apply the CSS to the header, template columns and sorry, individual buttons.  But if you have a .GVSelectButton class and apply it, its still an improvement over styling each one.

Charles, thanks, understand what you're getting at.  If it's not possible to do what I want to do then I just needed to know that.

Thanks again! 

I don't want to say it's impossible, just unlikely :)  I think there may be a way to inherit that from a master page but I don't have the skills.

 To make the DetailView's command field show up as images and don't need to configure the command field for every detailview, I think you can implement it by implementing a custom control inheriting from standard detailview control. I only provide a sample and you can optimize it to what ever you want.

 The following is my sample code.

Line 5 to 9 is just try to find the command fields, which you can optimize.

You can change line 18~23 to six properties. If you change these properties of field to the custom control's properties as it own, then you can place these properties to skin file for this custom control.

Hope this helps.... 

1        public class MyDetailView2 : DetailsView
2        {
3            protected override void CreateChildControls()
4            {
5                for(int i=0;i<this.Fields.Count;i++)
6                {
7                    if(this.Fields[i].ShowHeader == false)
8                        this.Fields.RemoveAt(i);
9                }
10   
11               CommandField comfiled = new CommandField();
12               comfiled.ButtonType = ButtonType.Image;
13               comfiled.ShowCancelButton = true;
14               comfiled.ShowDeleteButton = true;
15               comfiled.ShowEditButton = true;
16               comfiled.ShowInsertButton = true;
17   
18               comfiled.CancelImageUrl = "~/App_Themes/Blue/Images/Cancel.gif";
19               comfiled.DeleteImageUrl = "~/App_Themes/Blue/Images/Delete.gif";
20               comfiled.EditImageUrl = "~/App_Themes/Blue/Images/Edit.gif";
21               comfiled.InsertImageUrl = "~/App_Themes/Blue/Images/page.gif";
22               comfiled.NewImageUrl = "~/App_Themes/Blue/Images/page.gif";
23               comfiled.UpdateImageUrl = "~/App_Themes/Blue/Images/save.png";
24   
25               this.Fields.Add(comfiled);
26   
27               base.CreateChildControls();
28           }
29       }

That is a very good solution.

I think that's what I'll do with my CslaGridview