首页 | 互联网 | IT动态 | IT培训 | Cisco | Windows | Linux | Java | .Net | Oracle | 软件测试 | C/C++ | 嵌入式开发 | 存储世界 | 服务器
网络设备 | IDC | 安全 | 求职招聘 | 数字网校 | 网页设计 | 平面设计 | 技术专题 | 电子书下载 | 教学视频 | 源码下载 | 搜索 | 博客 | 论坛
中国IT实验室Dotnet频道
中国IT教育
Google
首页 ASP.NET  C#  XML/WebService ADO.NET VC.NET VB.NET .NET 资讯动态 专题 RSS订阅 讨论 下载
您现在的位置: 中国IT实验室 >> Dotnet >> ASP.NET >> 正文

在ASP.NET 2.0中使用样式、主题和皮肤

  利用主题来定制站点

  前面的部分演示了几种通过设置控件自身的样式属性来指定控件样式的方法。例如,我们看看如下的页面(代码),在这个页面上的各个控件上都应用了很多样式设置。

<asp:Label ID="Label1" runat="server" Text="Hello 1" Font-Bold="true" ForeColor="orange" /><br />

<asp:Calendar BackColor="White" BorderColor="Black" BorderStyle="Solid" CellSpacing="1" Font-Names="Verdana" Font-Size="9pt" ForeColor="Black" Height="250px" ID="Calendar1" NextPrevFormat="ShortMonth" runat="server" Width="330px">
<SelectedDayStyle BackColor="#333399" ForeColor="White" />
<OtherMonthDayStyle ForeColor="#999999" />
<TodayDayStyle BackColor="#999999" ForeColor="White" />
<DayStyle BackColor="#CCCCCC" />
<NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="White" />
<DayHeaderStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" Height="8pt" />
<TitleStyle BackColor="#333399" BorderStyle="Solid" Font-Bold="True" Font-Size="12pt"
ForeColor="White" Height="12pt" />
</asp:Calendar>

  作为在各个控件上指定样式的补充,ASP.NET 2.0引入了"主题"的概念,它提供了一种定义站点的控件和页面的样式设置的简单途径,而且它与应用程序的页面是分离的。主题的优势在于,你在设计站点的时候不用考虑它的样式,在将来应用样式的时候,不必更新页面或应用程序代码。你还可以从外部获取定制的主题,然后应用到自己的应用程序上。主题的优势是,样式设置都存储在一个单独的位置,它的维护与应用程序是分离的。

  下面的例子演示了一个带有主题的页面。请注意,这个页面本身没有包含任何样式信息。主题在运行时自动地把样式属性应用到页面的控件上。

<%@ Page Language="VB" Theme="ExampleTheme" %>

<asp:Label ID="Label1" runat="server" Text="Hello 1" /><br />
<asp:Calendar ID="Calendar1" runat="server"/>
<asp:GridView ID="GridView1" AutoGenerateColumns="False" DataSourceID="SqlDataSource1" DataKeyNames="au_id" runat="server">
……
</asp:GridView>
<asp:SqlDataSource ConnectionString="<%$ ConnectionStrings:Pubs %>" ID="SqlDataSource1" runat="server" SelectCommand="SELECT [au_id], [au_lname], [au_fname], [state] FROM [authors]">
</asp:SqlDataSource>

  App_Themes文件夹

  主题位于应用程序根目录的App_Themes文件夹中。主题由一个为主题命名的子目录和这个子目录下的一个或多个皮肤文件(带有.skin扩展名)组成。主题还可以包含CSS文件和/或存放静态文件(例如图像)的子目录。下图显示了定义了两个主题的App_Themes目录,分别叫做"Default"和"White",每个主题包含一个皮肤文件和一个CSS文件。


  查看前面的例子,你会发现皮肤文件的内容就是控件如何显示的简单定义。一个皮肤文件可以包含多个控件定义,例如为每种控件类型提供一个定义。在应用主题的时候,主题中定义的控件属性自动地重载相同类型的控件的本地属性值。例如,皮肤文件中的<asp:Calendar Font-Name="Verdana" runat="server"/>控件定义将会引发应用了该主题的页面中的所有Calendar控件都使用Verdana字体。该控件的这个属性的本地值都会被主题重载。请注意,在皮肤文件中给控件定义指定ID属性是错误的。

  全局的和应用程序的主题

  主题可以应用于应用程序层或机器层(用于所有的应用程序)。应用程序层的主题放置在应用程序根目录下的App_Themes目录中。全局主题放置在ASP.NET安装目录下的ASP.NETClientFiles文件夹下的"Themes"目录中,例如%WINDIR%\Microsoft.NET\Framework\<version>\ASP.NETClientFiles\Themes。IIS Web站点的全局主题的位置是Inetpub\wwwroot\aspnet_client\system_web\<version>\Themes。
给页面指定主题

  通过把<%@ Page Theme="..." %>指令设置为全局或应用程序层的主题(Themes或App_Themes目录下的文件夹名称),我们可以为单个页面指定主题。一个页面只能应用一个主题,但是该主题中的多个皮肤文件可以用于设置页面上的控件的样式信息。

  在配置文件中指定主题

  你也可以在Web.config文件的<pages theme="..."/>部分中指定应用在程序的所有页面上的主题。如果需要取消某个特定的页面的主题,需要把该页面指令的主题属性设置为空字符串("")。请注意,母版页不能应用主题;你应该在内容页上或配置文件中设置主题。

<configuration xmlns="http://schemas.microsoft.com/.NetConfiguration/v2.0">
<system.web>
<pages theme="ExampleTheme"/>
</system.web>
</configuration>


  禁止某个控件应用主题

  你可以通过把控件的EnableTheming属性设置为false,把特定的控件排除出主题的应用范围。

<%@ Page Language="VB" Theme="OrangeTheme" %>
……
<asp:Label ID="Label1" runat="server" Text="Hello 1" /><br />
<asp:Label ID="Label2" runat="server" Text="Hello 2" EnableTheming="False" /><br />


  主题中的命名皮肤(Named Skins)

  在默认情况下,皮肤文件中的控件定义会应用到页面上的所有相同类型的控件上。但是,你可能希望应用程序不同部分的同类控件显示为不同的样式。例如,在某个地方你可能希望文本和标签控件用粗体显示,在另一个地方可能希望它用斜体显示。你可以使用主题中的命名皮肤来实现这种功能。

上一页  [1] [2] [3] [4] [5] [6] 下一页

【责编:Peng】

中国IT教育

相关产品和培训
文章评论
 友情推荐链接
 认证培训
 专题推荐

 ·WEB程序开发--ASP.NET和PHP、JSP究竟学哪个?
 ·五步带你入门XML
 ·关于Java框架技术专题
 ·XML全攻略技术专题
 ·JAVA开源技术介绍专题
 ·Java嵌入式开发之J2ME技术专题
 ·超前体验 Oracle 11g的5个新特性…
 ·揭密使用VB.NET的五个实用技巧
 ·Oracle和SQL Server常用函数对比专题…
 ·展现C#世界 C#程序设计专题…
 今日更新
 社区讨论
 博客论点
 频道精选
 Dotnet频道相关导航