Never give up - LEO

人 只有在合适的地方 才能体现出最大的价值
  博客园  :: 首页  :: 联系 :: 订阅 订阅  :: 管理

Asp.net 2.0的Theme 和CSS

Posted on 2007-11-16 11:37  lizhiwen  阅读(1943)  评论(0编辑  收藏  举报

看了一下Asp.net 2.0的Theme和Skin,感觉和CSS差不多,这个市msdn上描叙两者的不同:
主题与级联样式表类似,因为主题和样式表均定义一组可以应用于任何页的公共属性。但是,主题与样式表在下列方面不同:
1.主题可以定义控件或页的许多属性,而不仅仅是样式属性。例如,使用主题,可以指定 TreeView 控件的图形、GridView 控件的模板布局,等等。
2.主题可以包括图形。
3.主题层叠的方式与样式表不同。例如,除非您显式地将主题作为样式表主题来应用,否则默认情况下属性值会重写本地属性值。
4.每页只能应用一个主题。不能向一页应用多个主题,这与样式表不同,样式表可以向一页应用多个样式表。

关于第一点,这个css确实是做不到。theme比css强点。
第二点我就不大理解了,css里也可以控制图片的路径阿?
第三点无非就是看在什么场合了,有的时候不希望最外层的覆盖最里层的,那么css比theme好。
第四点就更牵强了,一个页面一个主题,还不能共存,虽然说达到了统一,但是不就失去了灵活性吗?

而且theme的编写太麻烦了,还没有输入提示,还不如css。感觉skin好像用不上似的!



下面这些是msdn关于theme和skin的介绍:

主题是属性设置的集合,使用这些设置可以定义页面和控件的外观,然后在某个 Web 应用程中的所有页、整个 Web 应用程序或服务器上的所有 Web 应用程中一致地应用此外观。

主题和控件外观

主题由一组元素组成:外观、级联样式表 (CSS)、图像和其他资源。主题将至少包含外观。主题是在网站或 Web 服务器上的特殊目录中定义的。

外观

外观文件具有文件扩展名 .skin,它包含各个控件(例如,ButtonLabelTextBoxCalendar 控件)的属性设置。控件外观设置类似于控件标记本身,但只包含您要作为主题的一部分来设置的属性。例如,下面是 Button 控件的控件外观:

<asp:button runat="server" BackColor="lightblue" ForeColor="black" />

在 theme 文件夹中创建 .skin 文件。一个 .skin 文件可以包含一个或多个控件类型的一个或多个控件外观。可以为每个控件在单独的文件中定义外观,也可以在一个文件中定义所有主题的外观。

有两种类型的控件外观 -“默认外观”和“已命名外观”:

  • 当向页应用主题时,默认外观自动应用于同一类型的所有控件。如果控件外观没有 SkinID 属性,则是默认外观。例如,如果为 Calendar 控件创建一个默认外观,则该控件外观适用于使用本主题的页面上的所有 Calendar 控件。(默认外观严格按控件类型来匹配,因此 Button 控件外观适用于所有 Button 控件,但不适用于 LinkButton 控件或从 Button 对象派生的控件。)

  • 已命名外观是设置了 SkinID 属性的控件外观。已命名外观不会自动按类型应用于控件。而应当通过设置控件的 SkinID 属性将已命名外观显式应用于控件。通过创建已命名外观,可以为应用程序中同一控件的不同实例设置不同的外观。

级联样式表

主题还可以包含级联样式表(.css 文件)。将 .css 文件放在主题目录中时,样式表自动作为主题的一部分应用。使用文件扩展名 .css 在主题文件夹中定义样式表。

主题图形和其他资源

主题还可以包含图形和其他资源,例如脚本文件或声音文件。例如,页面主题的一部分可能包括 TreeView 控件的外观。您可以在主题中包括用于表示展开按钮和折叠按钮的图形。

通常,主题的资源文件与该主题的外观文件位于同一个文件夹中,但它们也可以在 Web 应用程序中的其他地方,例如,主题目录的某个子文件夹中。若要引用主题目录的某个子文件夹中的资源文件,请使用类似该 Image 控件外观中显示的路径:

<asp:Image runat="server" ImageUrl="ThemeSubfolder/filename.ext" />


也可以将资源文件存储在主题目录以外的位置。如果使用颚化符 (~) 语法来引用资源文件,Web 应用程序将自动查找相应的图像。例如,如果您将主题的资源放在应用程序的某个子目录中,则可以使用格式为 ~/SubFolder/filename.ext 的路径来引用这些资源文件,如下面的代码示例所示。

<asp:Image runat="server" ImageUrl="~/AppSubfolder/filename.ext" />

主题的应用范围

您可以定义单个 Web 应用程序的主题,也可以定义供 Web 服务器上的所有应用程序使用的全局主题。定义主题之后,可以使用 @ Page 指令的 ThemeStyleSheetTheme 属性将该主题放置在单个页上,或者可以通过设置应用程序配置文件中的 <pages> 元素将其应用于应用程序中的所有页。如果在 Machine.config 文件中定义了 <pages> 元素,则主题将应用于服务器上的 Web 应用程序中的所有页。

页面主题

页面主题是一个主题文件夹,其中包含控件外观、样式表、图形文件和其他资源,该文件夹是作为网站中的 \App_Themes 文件夹的子文件夹创建的。每个主题都是 \App_Themes 文件夹的一个不同的子文件夹。下面的代码示例演示一个典型的页面主题,它定义了两个名为 BlueThemePinkTheme 的主题。

MyWebSite
App_Themes
BlueTheme
Controls.skin
BlueTheme.css
PinkTheme
Controls.skin
PinkTheme.css

全局主题

全局主题是可以应用于服务器上的所有网站的主题。当您维护同一个服务器上的多个网站时,可以使用全局主题定义域的整体外观。

全局主题与页面主题类似,因为它们都包括属性设置、样式表设置和图形。但是,全局主题存储在 Web 服务器的名为 \Themes 的全局文件夹中。服务器上的任何网站以及任何网站中的任何页面都可以引用全局主题。主题设置优先级

可以通过指定主题的应用方式来指定主题设置相对于本地控件设置的优先级。

如果设置了页的 Theme 属性,则主题和页中的控件设置将进行合并,以构成控件的最终设置。如果同时在控件和主题中定义了控件设置,则主题中的控件设置将重写控件上的任何页设置。即使页面上的控件已经具有各自的属性设置,此策略也可以使主题在不同的页面上产生一致的外观。例如,它使您可以将主题应用于在 ASP.NET 的早期版本中创建的页面。

此外,也可以通过设置页面的 StyleSheetTheme 属性将主题作为样式表主题来应用。在这种情况下,本地页设置优先于主题中定义的设置(如果两个位置都定义了设置)。这是级联样式表使用的模型。如果您希望能够设置页面上的各个控件的属性,同时仍然对整体外观应用主题,则可以将主题作为样式表主题来应用。

可以使用主题来定义的属性

通常,可以使用主题来定义与某个页或控件的外观或静态内容有关的属性。只能设置那些其 ThemeableAttribute 属性 (Attribute) 设置为 true(在控件类中)的属性 (Property)。

显式地指定控件行为而不是指定外观的属性不接受主题值。例如,不能使用主题来设置 Button 控件的 CommandName 属性。同样,不能使用主题来设置 GridView 控件的 AllowPaging 属性或 DataSource 属性。