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

　　给Web服务器控件应用样式

　　Web 服务器控件添加了几个用于设置样式的强类型属性（例如背景色、前景色、字体名称和大小、宽度、高度等等），从而为样式提供了更多层次的支持。这些样式属性表现了HTML中可用的样式行为的子集，并表现为System.Web.UI.WebControls.WebControl基类直接暴露的"平面"属性。使用这些属性的优势在于，在开发工具（例如微软Visual Studio .NET）中，它们提供了编译时的类型检测和语句编译。

　　下面的例子显示了一个应用了几种样式的WebCalendar控件。请注意，当设置的属性是类类型（class type）的时候（例如字体），你必须使用子属性语法PropertyName-SubPropertyName（属性－子属性）：

＜ASP:Calendar runat="server" BackColor="Beige" ForeColor="Brown" BorderWidth="3" …… /＞

　　System.Web.UI.WebControls名字空间包含了Style基类，它封装了公用的样式属性（其它的样式类，例如TableStyle和TableItemStyle都继承自这个基类）。为了指定控件的各个显示元素，大多数Web服务器控件都暴露了这个类型属性。例如，WebCalendar暴露和很多样式属性：DayStyle、WeekendDayStyle、TodayDayStyle、SelectedDayStyle、OtherMonthDayStyle和NextPrevStyle。你可以使用子属性语法PropertyName-SubPropertyName来设置这些样式的属性，如下面的例子所示：

＜ASP:Calendar runat="server" …… DayStyle-Width="50px" DayStyle-Height="50px" TodayDayStyle-BorderWidth="3" WeekEndDayStyle-BackColor="palegoldenrod" WeekEndDayStyle-Width="50px" WeekEndDayStyle-Height="50px" SelectedDayStyle-BorderColor="firebrick" SelectedDayStyle-BorderWidth="3" OtherMonthDayStyle-Width="50px" OtherMonthDayStyle-Height="50px" /＞

　　下面的语法有稍微的不同，它允许你把Style属性声明为Web服务器控件标记内嵌套的子元素：

＜ASP:Calendar ... runat="server"＞ ＜TitleStyle BorderColor="darkolivegreen" BorderWidth="3" BackColor="olivedrab" Height="50px" /＞ ＜/ASP:Calendar＞

　　下面的例子显示了一种替代语法，但是它的功能与前面的语法是一样的。

＜ASP:Calendar id="MyCalendar" runat="server" …… ＞ ＜TitleStyle BorderColor="darkolivegreen" BorderWidth="3" BackColor="olivedrab" Height="50px" /＞ ＜DayHeaderStyle BorderColor="darkolivegreen" BorderWidth="3" BackColor="olivedrab" ForeColor="black" Height="20px" /＞ ＜WeekEndDayStyle BackColor="palegoldenrod" Width="50px" Height="50px" /＞ ＜DayStyle Width="50px" Height="50px" /＞ ＜TodayDayStyle BorderWidth="3" /＞ ＜SelectedDayStyle BorderColor="firebrick" BorderWidth="3" /＞ ＜OtherMonthDayStyle Width="50px" Height="50px" /＞ ＜/ASP:Calendar＞

　　使用HTML服务器控件的时候，你可以使用CSS类定义给Web服务器控件应用样式。WebControl基类暴露了一个叫做CssClass的字符串属性，用于设置样式类：

＜style＞ .calstyle { font-size:12pt; font-family:Tahoma,Arial; } ＜/style＞ ＜ASP:Calendar CssClass="calstyle" runat="server" …… /＞

　　如果某个服务器控件上设置的属性没有与该控件的强类型属性相对应，那个该属性和值就被填充到控件的Attributes集合中。在默认情况下，服务器控件会把这些属性不作更改地呈现在HTML中，并返回给作出请求的浏览器客户端。这意味着，我们可以直接设置Web服务器控件的样式和类属性，而不必使用强类型的属性。尽管它要求我们理解控件的实际显示过程，但是它也是应用样式的一个灵活的途径。对于标准的输入控件，这样的操作用处很大，如下面的例子所示：

＜ASP:TextBox runat="server" class="beige" style="font-weight:700;"/＞ ＜ASP:TextBox TextMode="Password" runat="server" class="beige"/＞ ＜ASP:DropDownList class="beige" runat="server"＞ ＜ASP:ListItem＞Default Desktop＜/ASP:ListItem＞ ＜ASP:ListItem＞My Stock Portfolio＜/ASP:ListItem＞ ＜ASP:ListItem＞My Contact List＜/ASP:ListItem＞ ＜/ASP:DropDownList＞ ＜ASP:Button Text="Submit" runat="server" class="beige"/＞

　　我们也可以使用WebControl基类的ApplyStyle方法来编程设置Web服务器控件的样式，如下面的代码所示：

＜script language="VB" runat="server"＞ Sub Page_Load(Src As Object, E As EventArgs) Dim MyStyle As New Style MyStyle.BorderColor = Color.Black MyStyle.BorderStyle = BorderStyle.Dashed MyStyle.BorderWidth = New Unit(1) MyLogin.ApplyStyle (MyStyle) MyPassword.ApplyStyle (MyStyle) MySubmit.ApplyStyle (MyStyle) End Sub ＜/script＞ Login: ＜ASP:TextBox id="MyLogin" runat="server" /＞/＜p/＞ Password: ＜ASP:TextBox id="MyPassword" TextMode="Password" runat="server" /＞ View: ＜ASP:DropDownList id="MySelect" runat="server"＞ ... ＜/ASP:DropDownList＞

 

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