When you started working with ASP.NET 2.0, especially using Visual Studio 2005 and added controls to the web page like a Textbox control you may of have recognized that there are two new properties (attributes) present in almost every control. They are the EnableTheming and ThemeID. Also there are additional attributes for the Page directive related to Themes.

Themes are a feature similar to style sheets as they help to supply a standard look and feel to web controls. You can use CSS style sheets to supply styles to HTML elements but if you wanted to use a set of predefined styling attributes to your web controls then you should use a Theme.

Themes are contained in a  special ASP.NET folder called App_Themes and each Theme you want to add in your web application should reside in a separate folder under this App_Themes folder. Let’s say you want to create a Theme called Dallas for the visitors that are coming from Dallas then you can create a DallasTheme folder under App_Themes folder to represent this Theme. In this folder you need to create a skin file. A skin file a file in which you describe the visual styles that are used by pages that will use this Theme. The name if the skin file is not important but the extension should be .skin.

In the skin file you just need to add the exact definitions of the web controls with all the visual attributes you want. You need to add the runat=”server” attribute but beware of adding the ID attribute because that will cause an error. For example I have a skin file with the following contents

<asp:TextBox runat="server" Font-Names="Verdana" Font-Size="11px" Width="200px" BorderStyle="Solid" BorderColor="#cc6666" BackColor="#ffcccc" />

And this file is placed in the App_Themes/DallasTheme folder. Remember that the theme is identified by the theme folder name in this case DallasTheme.

After you’ve placed the skin file you need to set a web page to use this Theme. You can enable a Theme for the entire page by setting the Theme attribute of the page equal to the name of the Theme. In this case it would be

<%@ Page Language="VB" Theme="DallasTheme" %>

Now at every place where a Textbox web control is used, it will be rendered with the styles defined in the skin file. If you want to disable the Theme for a specific control you can set its EnableTheming property to false and it won’t get the styles from the skin file and instead you can add your own b specifying attributes.

You can also define more than one style for a web control in the skin file by adding the SkinID attribute to the web control definition in the skin file and in the web page that is utilizing the Theme you can set the control’s SkinID equal to the one you want to use from the skin file.