如何:定义 ASP.NET 页面主题

更新:2007 年 11 月

在 Visual Web Developer 中,您可以定义一些页主题,然后可以将这些页主题应用于应用程序的一个或多个页。您也可以创建计算机级的主题,这种主题可用在服务器上的多个应用程序中。

主题由多个支持文件组成,包括页外观样式表、定义服务器控件外观的控件外观,以及构成主题的任何其他支持图像或文件。无论主题是定义为页主题还是全局主题,主题的内容都是相同的。

通过使用 Theme 或 @ Page 指令的 StyleSheetTheme 属性,或者通过在应用程序配置文件中设置 pages 元素(ASP.NET 设置架构) 元素,都可以应用主题。Visual Web Developer 只以可视方式显示使用 StyleSheetTheme 属性应用的主题。

创建页主题

  1. 在解决方案资源管理器中,右击要为其创建页主题的网站名称,然后单击**“添加 ASP.NET 文件夹”**。

  2. 单击**“主题”**。

    如果 App_Themes 文件夹不存在,Visual Web Developer 则会创建该文件夹。Visual Web Developer 即为主题创建一个新文件夹,作为 App_Themes 文件夹的子文件夹。

  3. 键入新文件夹的名称。

    此文件夹的名称也是页主题的名称。例如,如果您创建一个名为 \App_Themes\FirstTheme 的文件夹,则主题的名称为 FirstTheme。

  4. 将构成主题的控件外观、样式表和图像的文件添加到新文件夹中。

将外观文件和外观添加到页主题

  1. 在解决方案资源管理器中,右击主题的名称,然后单击**“添加新项”**。

  2. 在**“添加新项”对话框中,单击“外观文件”**。

  3. 在**“名称”框中,键入 .skin 文件的名称,然后单击“添加”**。

    通常的做法是为每个控件创建一个 .skin 文件,如 Button.skin 或 Calendar.skin。但是,您也可以根据需要创建任意数量的 .skin 文件。

  4. 在 .skin 文件中,使用声明性语法添加标准控件定义,但仅包含要为主题设置的属性。控件定义必须包含 runat="server" 属性,但不能包含 ID="" 属性。

    下面的代码示例演示 Button 控件的默认控件外观,其中定义了主题中所有 Button 控件的颜色和字体。

    <asp:Button runat="server" 
      BackColor="Red" 
      ForeColor="White" 
      Font-Name="Arial" 
      Font-Size="9px" />
    

    Button 控件外观不包含 skinID 属性。它将应用于使用主题的应用程序中所有未指定 skinID 属性的 Button 控件。

    ms247256.alert_note(zh-cn,VS.90).gif说明:

    创建控件外观的简单方法是将控件添加到页,并对其进行配置,使其具有您想要的外观。例如,您可以将一个 Calendar 控件添加到页,并设置其日标题、选定的日期和其他属性。然后,您可以将控件定义从页中复制到外观文件,但必须移除 ID 属性。

  5. 对您想创建的每个控件外观文件重复步骤 2 和 3。

    ms247256.alert_note(zh-cn,VS.90).gif说明:

    每个控件只能定义一个默认外观。使用外观的控件声明中的 SkinID 属性为相同类型的控件创建命名外观。

将级联样式表文件添加到页主题

  1. 在解决方案资源管理器中,右击主题的名称,然后单击**“添加新项”**。

  2. 在**“添加新项”对话框中,单击“样式表”**。

  3. 在**“名称”框中,键入 .css 文件的名称,然后单击“添加”**。

    当主题应用于页时,ASP.NET 向页的 head 元素添加对样式表的引用。有关更多信息,请参见 如何:应用 ASP.NET 主题

创建全局主题

全局主题应用于服务器上的所有网站。创建全局主题文件夹的位置取决于您是使用 Internet 信息服务 (IIS) 运行网站还是使用 ASP.NET Development Server 测试网站。

ms247256.alert_note(zh-cn,VS.90).gif说明:

如果您使用文件系统网站,则默认情况下,Visual Web Developer 启动 ASP.NET Development Server 来运行网站进行测试。对于其他类型的网站,Visual Web Developer 在 IIS 中运行页进行测试。

创建全局主题

  1. 使用下面的路径创建 Themes 文件夹。

    %windows%\Microsoft.NET\Framework\version\ASP.NETClientFiles\Themes
    
    ms247256.alert_note(zh-cn,VS.90).gif说明:

    全局主题的文件夹名称为 Themes,而不是 App_Themes,因为后者用于页主题。

    创建 Themes 文件夹的子文件夹以保存全局主题文件。

    子文件夹的名称即是主题的名称。例如,如果您创建一个名为 \Themes\FirstTheme 的文件夹,则主题的名称为 FirstTheme。

  2. 将构成全局主题的控件外观、样式表和图像的文件添加到新文件夹中。

    ms247256.alert_note(zh-cn,VS.90).gif说明:

    在定义全局主题时,不能使用 Visual Web Developer 直接将外观和样式表文件添加到全局主题中。您可能会发现一种更简单的方式,即将主题作为页主题进行定义和测试,然后将其复制到 Web 服务器上用于全局主题的文件夹中。

  3. 如果网站是要使用 ASP.NET Development Server 测试的文件系统网站,则可以立即对主题进行测试。

  4. 如果要使用本地 IIS 网站测试网站,则打开命令窗口,然后运行 aspnet_regiis -c 在运行 IIS 的服务器上安装主题。

  5. 如果要在远程网站或 FTP 网站上测试主题,则必须使用下面的路径手动创建 Themes 文件夹。

    IISRootWeb\aspnet_client\system_web\version\Themes
    

请参见

概念

ASP.NET 主题和外观概述