Definition:


Themes are similar to Cascading Style Sheets (CSS) in that they enable you to define visual styles for your Web pages. Themes go further than CSS, however, in that they allow you to apply styles, graphics, and even CSS files themselves to the pages of your applications. You can apply ASP.NET themes at the application, page, or server control level.

To make life easy for the developer, ASP.NET comes with free prepackaged themes that you can use for your pages or applications. You find these themes located at C:\WINDOWS \Microsoft .NET \Framework \v2.0.xxxxx \ASP.NETClientFiles \Themes. The available themes that come with ASP.NET 2.0 include

BasicBlue
SmokeAndGlass

Themes are introduced in ASP.NET 2.0 to counter the troubles faced by developers to define the layout of server controls and make them look coherent to the overall application, with minimum possible efforts. Default or Global themes are contained in a special folder inside the framework and can be declared in the source as well as class files. However, custom made themes can also be saved inside the predefined "App_Themes" folder inside ASP.NET applications, making them easier to manage and interpolate according to your needs. The essential part of themes are skin files with .skin extension. Besides skin files, a theme can be composed of styles sheets .css files as well as images for added support for the layout of the website.


Dynamically Applying theme to a single ASP.NET page:

In order to see how to use one of these themes, create a basic page, which includes text, a text box, a button, and a calendar
Observe the following example this will show you how we can easily implement a theme or change a theme for a asp page

Example:

protected void Page_PreInit(object sender, EventArgs e)
{
string theme = ""; // setting the value to none
if (Page.Request.Form.Count > 0)
{
// "Themes" is the ID of dropdownlist
theme = Page.Request["Themes"].ToString();
if (theme == "Default")
{
theme = "";
}
}
this.Theme = theme; // applying themes to the overall page
}

Before Going to this we have to create our own Theme for this the following code is useful

<asp:Label runat="server" ForeColor="#585880"
Font-Size="0.9em" Font-Names="Verdana" />

<asp:Calendar runat="server" BorderStyle="double"
BorderColor="#E7E5DB" BorderWidth="2" BackColor="#F8F7F4"
Font-Size=".9em" Font-Names="Verdana">
<TodayDayStyle BackColor="#F8F7F4" BorderWidth="1"
BorderColor="#585880" ForeColor="#585880" />
<OtherMonthDayStyle BackColor="transparent"
ForeColor="#CCCCCC" />
<SelectedDayStyle ForeColor="#6464FE"
BackColor="transparent"
cssclass="theme_highlighted" />
<TitleStyle Font-Bold="True" BackColor="#CCCCCC"
ForeColor="#585880" BorderColor="#CCCCCC"
BorderWidth="1pt" cssclass="theme_header" />
<NextPrevStyle Font-Bold="True" ForeColor="#585880"
BorderColor="transparent"
BackColor="transparent" />
<DayStyle ForeColor="#000000" BorderColor="transparent"
BackColor="transparent" />
<SelectorStyle Font-Bold="True" ForeColor="#696969"
BackColor="#F8F7F4" />
<WeekendDayStyle Font-Bold="False"
ForeColor="#000000" BackColor="transparent" />
<DayHeaderStyle Font-Bold="True" ForeColor="#585880"
BackColor="Transparent" />
</asp:Calendar>


Like this even we can create our own theme for button, textbox and every control...........


The Skins are of two types
1) Default Skin
2) Named Skin

Default skin(it does'nt contain skinid) contains the theme which automatically applied to the page whenever the page gets initiated..............

Named Skin:

Skins with SkindID's are known as Named skins. Named skins define different layouts for two or more server controls with unique ID's. IDs can be defined in the same file or you can make different files with different ID's, it all depends on your personal approach and likings. SkinID can be referenced to call named skins. Here is an example:

<asp:Label runat="server" ForeColor="#585880"
Font-Size="0.9em" Font-Names="Verdana" SkinID="LabelHeader" />

<asp:Label runat="server" ForeColor="#585980" Font-Size="0.8em"
Font-Names="Arial" SkinID="LabelFooter" />

by using these skinids we reference the perticular skin and their attributes..... consider the following example

<asp:Label id="Header" runat="server" SkinID="LabelHeader" />

<asp:Label id="Header" runat="server" SkinID="LabelFooter" />


in the above example we're referencing the skinid which we created earlier so that the .net frame work can identify the skinid and it applies
all the attributes for the label like forecolor, font size, font names likewise.........