Difference between Theme and StyleSheetTheme

Just like me, you may have wondered why there is theming options in ASP.NET - Theme and StyleSheetTheme. Understanding this difference may help you implement styling in your web page.

Theme overrides the styling applied by control attributes, on the other hand StyleSheetTheme do not override them.

Lets see an example of what is meant by the above line.

Say, we have a have a page Default.aspx which declares the page directive,

<%@ Page Theme="MyTheme" %>

If MyTheme contains a skin file which defines the style for default Label control



now if we use a label control in our Default.aspx page like below,



The label control's text will be in Blue color, becuase Theme always forcefully overrides the Styling attributes declared in the control level.

Now if we change the Page directive to use StyleSheetTheme,

<%@ Page StyleSheetTheme="MyTheme" %>

Now the label control font will be in Red as the StyleSheetTheme will no more override the inline style attribute.

If we look at the order in which the styling is applied we may get a more clear idea.

1. Theme attribute in the Page directive.
2. Theme declaration element in the Web.config file.
3. Local control attributes.
4. StyleSheetTheme attribute in the Page directive.
5. StyleSheetTheme element in the Web.config file.