asp.net 2.0 中新增加了 theme 的功能,它的出现能让网站实现换肤更加容易。
theme 的实现包括:css、skin、masterpage。
css 是用于控制所有 html 标记的外观。
skin 是用于控制所有 asp.net 服务器调整的外观,并且可以通过属性 cssclass 定义它的 css 样式。
masterpage 是 *.aspx 页面模版,不过它没有被定义到 theme 中。
------------------------------------------------
·创建 theme 的例子:
1、在 web 项目中创建 app_themes 目录。它是预定义的目录,asp.net 2.0 会自动识别其目录下的 theme 。
2、在 app_themes 目录创建 orangetheme、bluetheme 两个子目录。
3、为 app_themes 下的每个子目录添加 skin 文件,如 control.skin 。asp.net 2.0 会自动分析每一个 skin 文件,在这里的命名只需要为了开发时方便分类。
4、也可以为 app_themes 下的每个子目录添加 css 文件。asp.net 2.0 也会自动将每一个 css 文件添加到每一个使用此样式的页面中去。
·定义页面内容与 theme 样式
1、default.aspx 页面定义如下:
<%@ page theme="orangetheme" %>
<html>
<head runat="server">
<title>orange page</title>
</head>
<body>
<form id="form1" runat="server">
enter your name:<br />
<asp:textbox id="txtname" runat="server" />
<br /><br />
<asp:button id="btnsubmit" text="submit name" runat="server"/>
</form>
</body>
</html>
2、在 orangetheme 主页的 control.skin 文件中定义如下:
注意:只能指定外观属性,不能指定如 autopastback 等属性。
默认未命名的 skin 将会为所有 textbox 类型定义外观。
<asp:textbox backcolor="orange" forecolor="darkgreen" runat="server" />
<asp:button backcolor="orange" forecolor="darkgreen" font-bold="true" runat="server" />
已经命名 skinid 的将可以为指定 textbox 类型定义外观。
<asp:textbox skinid="title" backcolor="orange" forecolor="darkgreen" runat="server" />
·在页面中使用 theme
1、在 aspx 文件顶部 <%@ page %> 中添加 theme="default" 属性。这样它就可以使用 default 主题了。
2、如果想到在整个网站应用某个 theme 就需要在 web.config 定义。
<configuration>
<system.web>
<pages theme="orangetheme" />
</system.web>
</configuration>
这样的定义相当于默认一个 theme 在所有网站文件中,使用时仍可以为每个页面定义 theme 。
skin 部分会使用 page 面中定义的 theme ,而 css 会重载默认主页中的 css 样式表。
3、指定好 theme 之后所有的外观都会使用 skin 中定义的。你也可以指定控件的 skinid 来定义单独外观。
4、如果想用编程方式定义 theme 必需在 page_preinit事件中处理,如下:
void page_preinit(object sender, eventargs e)
{
page.theme = request["themename"];
如果需要以编程的方式为 page 载入 masterpage 文件,也需要在此定义。
this.masterpagefile = request["masterpagefile"];
}
了解了这些技术,将会让网站更加多变。
新闻热点
疑难解答
图片精选