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

ASP.NET
ASP.NET编程中的十大技巧
ASP.NET常用函数(推荐)
ASP.NET上传图片并生成可带版权信息的缩略图
用javascript打造搜索工具栏
ASP.NET中动态控制RDLC报表
用ASP.NET还原与恢复Sql server
在ASP.NET里得到网站的域名
Asp.net中的mail的发送
用ASP.Net实现文件的在线压缩和解压缩
ASP.NET中文件上传下载方法集合
ASP.NET通过Remoting service上传文件
ASP.NET2.0服务器控件之Render方法
ASP.NET2.0新特性概述
asp.net2.0如何加密数据库联接字符串
用.NET 2.0压缩/解压功能处理大型数据
ASP.NET入门随想之检票的老太太
ASP与ASP.NET互通COOKIES的一点经验
ASP.NET2.0数据库入门之SqlDataSource
ASP.NET2.0数据库入门之SQL Server
ASP.NET 2.0下的条件编译

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 139 ::
收藏到网摘: 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>