05-ASP(主题)
主题和母版页在一个完整的网页设计当中,都是必须要涉及到的知识,了解了主题和母版页的作用后,在必要的时刻会大大减少工作量,使整个网页的结构布局和外观样式更加的清晰。
主题
在一个完整的网页中,总是会需要一个主题,用来给定网页中整体的颜色风格、字体、控件的外观等等,可以类比成QQ当中的各种应用主题,或者是手机的主题风格。而网页也需要用到主题,使整个界面更加的美观有整体性。如下就是关于主题的一些知识:
概述
主题中可以包括:
1、外观文件(.skin文件):设置各类控件的属性,一个.skin文件中,可以包含一个或多个控件的一个或多个属性设置。其中控件的外观分为默认外观和已命名外观。如果控件外观没有SkinID属性,则是默认外观,默认外观自动用于同一类型的所有控件。否则,应用于已命名外观。
<asp:Button runat="server" Backcolor="lightblue"/>
//上面是按钮控件的默认外观,因为并没有SkinID这个属性。
<asp:Button runat="server" SkinID="StartButton" Backcolor="lightblue"/>
//上面是按钮控件的已命名外观。
2、级联样式表文件(.css文件):主要设置网页元素的属性,控制网页外观,网页元素位置,外观以及创建特殊效果的能力。
3、图形资源:图片等等
创建主题
右击需要创建主题的网站项目,选择【添加】->【添加ASP.NET文件夹】->【主题】。(如图)
此时该网站项目下,就会有一个名为App_Themes的文件夹,文件夹中自动会有一个待命名的主题,可以为主题命名。
右击刚刚添加的主题,选择【添加】->【添加新项】,就会跳出快捷菜单,可以在菜单中选择外观文件或者样式表。
应用主题
主题可以用在一个页面中,也可以用在网站的所有页面。
1、将主题应用到个别网页,可以使用@Page指令的Theme或StyleSheetTheme属性将该主题应用到个别ASP.NET网页上。可以在要应用的网页中加入下面的这句代码。
<%@ Page Language="C#" Theme="主题名字" ... %>
<%@ Page EnableTheming="false" %>//设置网页不应用主题
2、将主题应用在所有网站的页面中,需要在配置文件(Web.config)中的pages中设置。
<configuration>
<system.web>
<pages theme="主题名字"/>
</system.web>
</configuration>
3. 把指定的外观应用到控件,如果主题文件中某类控件外观是已命名外观(例如,SkinID属性为greenBtn),那么,在网页中使用该类控件时,就可设置控件的SkinID属性,以表明控件使用这个已命名外观。例如:
<asp:Button runat="server" ID="Button1" SkinID="greenBtn" />
如果页面主题中没有包括与SkinID属性相匹配的控件外观,控件就会使用为该类型控件所定义的默认外观。
4、主题应用的优先级,首先应用StyleSheetTheme属性,再运用页中的控件属性,最后应用Theme属性。
5、以编程方式应用页面主题,例如按下一个按钮,或者点击某个文字链接后改变主题。
protected void Page_PreInit(object sender, EventArgs e)
{
this.Theme = Request.QueryString["NewTheme"];
}//在.aspx.cs文件中加入这段代码
<asp:HyperLink ID="HyperLink2" runat="server" NavigateUrl="~/Default.aspx?NewTheme=SkinFile2"><U>主题1</U></asp:HyperLink>
//在.aspx文件的HyperLink控件中加入NavigateUrl属性,使得改变主题。