6.2在主题中添加皮肤

在主题中添加皮肤

一个主题可以包含一个或多个皮肤文件。可以通过皮肤来修改所有具有皮肤效果的ASP.net控件的属性
在Web应用程序中所有的TextBox控件的背景设为黄色,dotted 为边框样式
Simple\TextBox.skin
<asp:TextBox BackColor="Yellow" BorderStyle="Dotted" Runat="Server"/>

建议:
皮肤文件名和待修改的控件名称一样,再加上皮肤的扩展名即可。


<%@ Page Language="C#" Theme="Simple" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox runat="server" />
    </div>
    </form>
</body>
</html>


注意:
1)Page后加上Theme
<%@ Page Language="C#" Theme="Simple" %>
2)默认情况下,所有的控件都是可主题化的,但可以修改Themeable为False来禁用主题

1、创建命名皮肤
  必填加红框
  Simple2\TextBox.skin
  <asp:TextBox SkinID="DashedTextBox" BorderStyle="Dashed" BorderWidth="5px" RunAt="Server"/>
<asp:TextBox   BorderStyle="Double" BorderWidth="5px" Runat="Server"/>



调用页面:
<%@ Page Language="C#" Theme="Simple2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Show Named Skin</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" SkinID="DashedTextBox" runat="server"></asp:TextBox>
        <br />
        <br />
        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
    </div>
    </form>
</body>
</html>

结果:


2、Themes与StyleSheetThemes
当在页面中应用主题时,主题中的控件属性会重写页面中的已有控件属性。也就是说:皮肤文件中的属性会重写页面中的属性。

Simple3\Label.skin
<asp:Label BackColor="Orange" Runat="Server"/>

<%@ Page Language="C#" Theme="Simple3" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Show Skin Theme</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="Label1" runat="server" Text="What color background do I have?" BackColor="Red"></asp:Label>
    </div>
    </form>
</body>
</html>


显示:

显示的是Skin中的

3、禁用主题
   每个Asp.net控件都包含名为EnableTheming的属性
  Simple4\Calendar.skin
 <asp:Calendar
     BackColor="White"
     BorderColor="White"
     BorderWidth="1px"
     Font-Names="Verdana"
     Font-Size="9pt"
     ForeColor="Black"
     NextPreFormat="FullMonth"
     Width="400px"
     Runat="Server">
     <SelectedDayStyle BackColor="#333399" ForeColor="white"/>
     <OtherMonthDayStyle ForeColor="#999999"/>
     <TodayDayStyle BackColor="#CCCCCC"/>
     <NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" VerticalAlign="Bottom"/>
     <DayHeaderStyle Font-Bold="True" Font-Size="8pt"/>
     <TitleStyle BackColor="White" BorderColor="Black" BorderWidth="4px" Font-Bold="True" Font-Size="12pt" ForeColor="#333399"/>
    </asp:Calendar>



ShowEnableTheming.aspx
<%@ Page Language="C#" Theme="Simple4" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Show EnableTheming</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Calendar ID="Calendar1" runat="server"></asp:Calendar>
        <br />
        <br />
        <asp:Calendar ID="Calendar2" EnableTheming="false" runat="server"></asp:Calendar>
    </div>
    </form>
</body>
</html>


4、在Web配置文件中注册主题
Web.Config
<configuration>
  <system.web>
    <pages theme="Site"/>
  </system.web>
</configuration>

Web.Config
<configuration>
  <system.web>
    <pages styleSheetTheme="Site"/>
  </system.web>
</configuration>

可以在页面中禁用主题
<%@ Page Language="c#" EnableTheming="false" %>

2011-4-28 14:20 danny

你可能感兴趣的:(C++,c,XHTML,asp.net,asp)