.skin vs .css from asp.net

Question

What is the main difference between .skin and .css in asp.net?

.skin is new enhancement of IDE. I have been working with .css. What is available in .skin that is not to .css

thanks, saj

Answer 1

In the skin file you can set properties of asp.net controls.

For example,

<asp:TextBox runat="server" Width="200"/>

All the TextBox controls in your application will have width 200.

You can give it a name and only the controls you like you can set them to apply a skin for example,

<asp:TextBox SkinID="MultiLineTextBox" runat="server" TextMode="MultiLine" Height="240"/>

now in a web page when adds TextBox control you can set its SkinID to be "MultiLineTextBox" as the following,

<asp:TextBox runat="server" SkinID="MultiLineTextBox"/>

and thus it will inherit the TextMode as MultiLine and the Height as 240.

To use the skin you have to add a theme to your application under the App_Themes folder and there you add the skin file, now to use this theme in your pages you have to set the EnableTheming property of the page to true, StylesheetTheme or Theme to the name of your theme. You can also set this properties in the config file.

Setting the theme in the page aspx,

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" EnableTheming="true" StylesheetTheme="Your Theme Name" %>

Setting the theme in the web.config,

<configuration>
   <system.web>
     <pages styleSheetTheme="Your Theme Name"></pages>
   </system.web>
</configuration>

Answer 2

Note that in terms of what these two things actually do there is a considerable difference. Any properties set in the .skin file are copied out to all of the page controls. An advantage to using Cascading Style Sheets is that the information is loaded and cached once. (and can be applied to multiple web pages.) Skin files can cause page bloat because all the properties set in the skin file must be merged with every affected control every time the page is rendered.

Additionally, the default behavior of the ASP.NET Theme .skin files is to override the properties of the controls being affected (this can be an unexpected behavior). For example, if you set the Width property for all ASP:Labels in your .skin file, all the ASP:Labels that use the skin file will have their Width properties set to that of the .skin file's regardless of the control's individual Width setting. To avoid this behavior, the ASP.NET StyleSheetTheme can be used to allow control-level properties to override the global .skin properties.