ASP.NET定义主题和外观

转载 2007年10月16日 08:58:00
定义
  主题由一组元素组成:外观、级联样式表 (CSS)、图像和其他资源。主题将至少包含外观。主题是在网站或 Web 服务器上的特殊目录中定义的。
  外观
  外观文件具有文件扩展名 .skin,它包含各个控件的属性设置。控件外观设置类似于控件标记本身,但只包含您要作为主题的一部分来设置的属性。
  有两种类型的控件外观 -“默认外观”和“已命名外观”:
  当向页应用主题时,默认外观自动应用于同一类型的所有控件。如果控件外观没有 SkinID 属性,则是默认外观。已命名外观是设置了 SkindID属性的控件外观。
  级联样式表
  主题还可以包含级联样式表(。css 文件)。将 .css 文件放在主题文件夹中时,样式表自动作为主题的一部分加以应用。使用文件扩展名 .css 在主题文件夹中定义样式表。
  主题图形和其他资源
  主题还可以包含图形和其他资源,例如脚本文件或声音文件。
  例子
  1、 首先选择网站项目名称→右键单击→添加新项
  2.系统会建立一个app_themes文件夹,并在里面建立一个皮肤文件夹sampleTheme,并在里面建立一个皮肤文件sampleTheme.skin.
  3.在皮肤文件夹sampleTheme中添加一个Label.skin文件和Calendar.skin文件。
  4.文件内容如下:
  Label.skin
<asp:label runat="server" 
    font-bold="true" 
    forecolor="orange" />
    
<asp:label runat="server" SkinID="Blue" 
    font-bold="true" 
    forecolor="blue" />
 
  Calendar.skin:
<asp:Calendar runat="server" 
    BackColor
="#FFFFCC" 
    BorderColor
="#FFCC66" 
    BorderWidth
="1px" 
    DayNameFormat
="FirstLetter" 
    Font-Names
="Verdana" 
    Font-Size
="8pt" 
    ForeColor
="#663399" 
    Height
="200px" 
    ShowGridLines
="True" 
    Width
="220px">
    
    
<SelectedDayStyle BackColor="#CCCCFF" Font-Bold="True" />
    
<SelectorStyle BackColor="#FFCC66" />
    
<OtherMonthDayStyle ForeColor="#CC9966" />
    
<TodayDayStyle BackColor="#FFCC66" ForeColor="White" />
    
<NextPrevStyle Font-Size="9pt" ForeColor="#FFFFCC" />
    
<DayHeaderStyle BackColor="#FFCC66" Font-Bold="True" Height="1px" />
    
<TitleStyle BackColor="#990000" Font-Bold="True" Font-Size="9pt" ForeColor="#FFFFCC" />
</asp:Calendar>

<asp:Calendar SkinID="Simple" runat="server" 
    BackColor
="White" 
    BorderColor
="#999999" 
    CellPadding
="4" 
    DayNameFormat
="FirstLetter" 
    Font-Names
="Verdana" 
    Font-Size
="8pt" 
    ForeColor
="Black" 
    Height
="180px" 
    Width
="200px">
    
    
<SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />
    
<SelectorStyle BackColor="#CCCCCC" />
    
<WeekendDayStyle BackColor="#FFFFCC" />
    
<OtherMonthDayStyle ForeColor="#808080" />
    
<TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />
    
<NextPrevStyle VerticalAlign="Bottom" />
    
<DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />
    
<TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" />
</asp:Calendar>
 
  在“源”视图中,向 @ Page 指令添加下面的属性:
<%...@ Page Theme="sampleTheme" ... %> 
 
  在页面中添加2个caleder和2个lable控件
       
 <asp:Calendar ID="Calendar1" runat="server"></asp:Calendar>

        
<asp:Calendar ID="Calendar2" runat="server" SkinID="Simple"></asp:Calendar>

        
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>

        
<asp:Label ID="Label1" runat="server" Text="Label" SkinID="Blue"></asp:Label>
 
  运行程序
  注意:
  1、如果主题是通过设置 @Page 指令或配置的 <pages/> 节的 Theme 属性 (attribute) 应用的,则主题中的外观属性 (property) 将重写页中目标控件的同名属性 (property)。
  2、通过将 @Page 指令或配置的 <pages/> 节的 StyleSheetTheme 属性设置为主题的名称,可以将主题定义作为服务器端样式来应用。主题属性用作 StyleSheetTheme 时,可能被页中的控件重写。
  3、 StyleSheetTheme 应在应用程序开发过程中应用,它作为从页中提取样式信息的手段,使应用程序的行为可独立于应用程序的外观进行维护。对应用程序应用 StyleSheetTheme 后,您可能还希望应用 Theme.如果对应用程序既应用 Theme 又应用 StyleSheetTheme,则按以下顺序应用控件的属性:
  首先应用 StyleSheetTheme 属性
  应用页中的控件属性(重写 StyleSheetTheme)
  最后应用 Theme 属性(重写控件属性和 StyleSheetTheme)
  4、在皮肤文件里面可以针对同一个控件设置多个皮肤风格,使用skinid来区分不同风格,并在aspx页面文件的控件中使用skinid来引用不同皮肤风格。
  5.以编程方式应用页面主题
  在页面的 PreInit方法的处理程序中,设置页面的 Theme属性。
  下面的代码示例演示如何根据查询字符串中传递的值按条件设置页面主题。
  为应用程序指定和禁用主题
Protected void Page_PreInit(object sender, EventArgs e)

...{

    
switch (Request.QueryString["theme"])

    
...{

        
case "Blue":

            
<b>Page.Theme = "BlueTheme";</b>

            
break;

        
case "Pink":

            
<b>Page.Theme = "PinkTheme";</b>

            
break;

    }


}


  6.
  将 @ Page 指令的 EnableTheming 属性设置为 false,
 <%...@ Page EnableTheming="false" %>
 
  7.对网站应用主题
  每个应用程序中都包括多个页面,并且为了保证和谐统一的用户界面,我们可以让所有页面使用同一主题。如果为在每个页头都设置相同的Theme属性值,那么非常麻烦。为了快速地为整个应用程序的所有页面设置相同的主题,可以设置Web.Config文件的<pages>配置节内容。
   
<configuration> <system.web> <pages theme="sampleTheme" /> </system.web> </configuration>
  

学习笔记--asp.net主题和外观(转自msdn,仅为自己学习存储和有意读者使用)

ASP.NET 主题和外观 .NET Framework 4 其他版本 1(共 1)对本文的评价是有帮助 - 评价此主题 ...
  • ztzi321
  • ztzi321
  • 2014年04月14日 09:56
  • 1214

asp.net主题文件(css+.skin)的使用

一、简介:     关于主题文件的创建,请参看本博客http://blog.sina.com.cn/s/blog_67aaf4440100nl5k.html   利用Themes我们可以很容易的更...
  • woshixuye
  • woshixuye
  • 2012年02月01日 08:09
  • 3404

学习笔记--asp.net主题和外观(转自msdn,仅为自己学习存储和有意读者使用)

ASP.NET 主题和外观 .NET Framework 4 其他版本 1(共 1)对本文的评价是有帮助 - 评价此主题 ...
  • ztzi321
  • ztzi321
  • 2014年04月14日 09:56
  • 1214

【ASP.net】解析Repeater 控件的模板

Repeater控件不具备内置的呈现功能,用户必须通过创建模板来为它提供布局. 重复的东西就说明有很多相同的,那就可以抽出来。抽出来的东西,面向对象中叫类,设计模式中可以是模板方法。在Repe...
  • u010542940
  • u010542940
  • 2014年12月04日 11:10
  • 1622

关于MFC中控件的外观风格

1、在VS2008中,通过设置项目属性
  • DOCAICSD
  • DOCAICSD
  • 2014年09月02日 10:18
  • 1178

MFC控件的外观编辑

VC++ MFC 按钮的全部样式Style转载地址:http://www.cnblogs.com/lujin49/p/4691107.html Button Style BS_3STATE 与复选...
  • xuanyuanlei1020
  • xuanyuanlei1020
  • 2016年09月19日 14:22
  • 2586

Wordpress外观及编辑

WordPress管理后台,外观下有很多实用工具,比如主题,小工具,菜单背景,顶部,编辑等有用的工具。 特别是编辑,可以自定义各种模板和CSS 式样。       注意实用编辑功能时,先备份,然后修...
  • esonbest1234
  • esonbest1234
  • 2016年02月24日 11:24
  • 874

用ASP.NET 2.0主题控制网站外观

自。NET Framework出现以来,对网站外观进行控制一直是ASP.NET开发者的期待。ASP.NET 2.0使之成为现实,应用它的主题与皮肤,我们可以对外观进行控制。ftubd.com   上...
  • zuanqin543
  • zuanqin543
  • 2014年04月26日 10:29
  • 235

装饰者模式与外观者模式的区别

(转载)http://bbs.bccn.net/thread-216717-1-1.html 很久没有来这一个论坛里了,一上来就看到很多关于设计模式的贴子上了精,今天我也来谈一下设计模式,我现在所介绍...
  • zhuhai__yizhi
  • zhuhai__yizhi
  • 2016年03月03日 09:55
  • 1082

asp.net中自定义类的应用

了解类的概念,参考下列图片:
  • yayun0516
  • yayun0516
  • 2014年11月21日 16:40
  • 837
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ASP.NET定义主题和外观
举报原因:
原因补充:

(最多只允许输入30个字)