当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > 在ASP.NET 2.0中使用样式、主题和皮肤

ASP.NET
asp.net css注释的影响
ASP.NET与数据库相关技巧
关于HtmlForm控件
三色交替的下拉列表框
精通ASP.NET中弹出窗口技术
ASP.NET Forums与现有系统整合方案示例
ASP.NET操作IIS中的虚拟目录
DataGrid与SQL Server 2000数据绑定
如何让Web应用程序在Client端实现导出报表功能
如何保证web app中的Send Email线程稳定性
关于用ASP.Net识别远程主机服务器种类
ASP.NET中上传下载文件
提高ASP.NET性能的方法
asp.net StreamReader 创建文件
asp.net如何生成图片验证码(简单)
一个.net 压缩位图至JPEG的代码
简单的SQL Server数据库数据读取与数据操作
获取网站的RSS聚合到自己的网页
.Net程序中整站通用的防SQL注入函数
asp.net生成缩略图及给原始图加水印的函数

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 106 ::
收藏到网摘: n/a

ASP.net2.0的主题和皮肤特性使你能够把样式和布局信息存放到一组独立的文件中,总称为主题(Theme)。接下来我们可以把这个主题应用到任何站点,用于改变该站点内的页面和控件的外观和感觉。通过改变主题的内容,而不用改变站点的单个页面,就可以轻易地改变站点的样式。主题也可以在开发者之间共享。

ASP.NET包含了大量的用于定制应用程序的页面和控件的外观和感觉的特性。控件支持使用Style(样式)对象模型来设置格式属性(例如字体、边框、背景和前景颜色、宽度、高度等等)。控件也支持使用样式表(CSS)来单独设置控件的样式。你可以用控件属性或CSS来定义控件的样式信息,或者把这些定义信息存放到单独的一组文件中(称为主题),然后把它应用到程序的所有或部分页面上。单独的控件样式是用主题的皮肤(Skin)属性来指定的。

本文用大量的示例演示了在ASP.NET 2.0中如何使用样式、主题和皮肤特性。

给控件应用样式

Web用户界面是非常灵活的,不同的Web站点的外观和感觉是截然不同的。目前广泛采用的样式表(CSS)在很大程度上就是负责处理Web上遇到的丰富的设计需求的。ASP.NET的HTML服务器控件和Web服务器控件都被设计成优先支持CSS样式表。这一部分讨论如何在服务器控件上使用样式,并演示了它们所提供的Web窗体的外观和感觉的非常细微的控制。

给HTML控件应用样式

标准的HTML标记通过style属性来支持CSS,我们可以用分号隔离的属性/值对(pair)来设置它。所有的ASP.NET HTML服务器控件都可以采用标准HTML标记的方式来接受样式。下面的例子演示了大量的应用到HTML服务器控件的样式。在源代码中你可以看到,这些样式都是在控件显示的时候传递给浏览器的。

以下是引用片段:

CSS还定义了class属性,你可以把它设置为文档中<style>...</style>内包含的CSS样式定义。Class属性使你能够一次定义样式,在多个服务器标记上使用,避免了样式的重复定义。HTML服务器控件的style属性可以用这种方式来设置,如下所示:

以下是引用片段:

以下为引用的内容:
<style>
.spanstyle 

font: 12pt verdana; 
font-weight:700;
color:orange;
}
.buttonstyle 

font: 8pt verdana;
background-color:lightgreen;
border-color:black;
width:100 
}
……
</style>
<span class="spanstyle" runat="server">
This is some literal text inside a styled span control
</span>
<p><font face="verdana"><h4>Styled Button</h4></font><p>
<button class="buttonstyle" runat="server">Click me!</button>

在分析ASP.NET页面的时候,在System.Web.UI.HtmlControls.HtmlControl类中,样式信息被填充到CssStyleCollection类型的Style属性。这个属性本质上是一个字典,它把控件的样式暴露为每个样式属性键的按字符串索引的值集合。例如,你可以使用下面的代码设置和检索HtmlInputText服务器控件的width样式属性:

以下是引用片段:

以下为引用的内容:
<script language="VB" runat="server" >
Sub Page_Load(Sender As Object, E As EventArgs)
MyText.Style("width") = "90px"
Response.Write(MyText.Style("width"))
End Sub
</script>
<input type="text" id="MyText" runat="server"/>

下面的例子显示了如何编程使用Style集合属性来控制HTML服务器控件的样式:

以下是引用片段:

以下为引用的内容:
<script language="VB" runat="server">
Sub Page_Load(Src As Object, E As EventArgs)
Message.InnerHtml &= "<h5>Accessing Styles...</h5>"
Message.InnerHtml &= "The color of the span is: " &MySpan.Style("color") &"<br>"
Message.InnerHtml &= "The width of the textbox is: " &MyText.Style("width") &"<p>"
Message.InnerHtml &= "MySelect's style collection is: <br><br>"
Dim Keys As IEnumerator
Keys = MySelect.Style.Keys.GetEnumerator()
Do While (Keys.MoveNext())
Dim Key As String
Key = CStr(Keys.Current)
Message.InnerHtml &= "<li>  "
Message.InnerHtml &= Key &"=" &MySelect.Style(Key) &"<br>"
Loop
End Sub
Sub Submit_Click(Src As Object, E As EventArgs)
Message.InnerHtml &= "<h5>Modifying Styles...</h5>"
MySpan.Style("color") = ColorSelect.Value
MyText.Style("width") = "600"
Message.InnerHtml &= "The color of the span is: " &MySpan.Style("color") &"<br>"
Message.InnerHtml &= "The width of the textbox is: " &MyText.Style("width")
End Sub
</script>