ASP.NET 主题(Themes)FAQ
1、主题是什么
主题由一组元素组成:外观、级联样式表 (CSS)、图像和其他资源。主题将至少包含外观。主题是在网站或 Web 服务器上的特殊目录中定义的。主题是一组Web Control的属性设置的集合,提供一种简单的方法设置控件的样式属性。
· 主题只在Web Control中有效
· 母板页(Master Page)上不能设置主题,但是主题可以在内容页面上设置
· 主题上设置的Web Control的样式覆盖页面上设置的样式
· 如果在页面上设置EnableTheming="false",主题无效
· 要在页面中动态设置主题,必须在页面生命周期Page_Preinit事件之前
· 主题包括.skin和.css文件
2、.skin是什么文件
.skin是外观文件,它包含各个控件(例如,Button、Label、TextBox 或 Calendar 控件)的属性设置。控件外观设置类似于控件标记本身,但只包含您要作为主题的一部分来设置的属性。例如,下面是 Button 控件的控件外观:
<asp:button runat="server" BackColor="lightblue" ForeColor="black" />
在 theme 文件夹中创建 .skin 文件。一个 .skin 文件可以包含一个或多个控件类型的一个或多个控件外观。可以为每个控件在单独的文件中定义外观,也可以在一个文件中定义所有主题的外观。有两种类型的控件外观 -“默认外观”和“已命名外观”:
· 当向页应用主题时,默认外观自动应用于同一类型的所有控件。如果控件外观没有 SkinID 属性,则是默认外观。例如,如果为 Calendar 控件创建一个默认外观,则该控件外观适用于使用本主题的页面上的所有 Calendar 控件。(默认外观严格按控件类型来匹配,因此 Button 控件外观适用于所有 Button 控件,但不适用于 LinkButton 控件或从 Button 对象派生的控件。)
· 已命名外观是设置了 SkinID 属性的控件外观。已命名外观不会自动按类型应用于控件。而应当通过设置控件的 SkinID 属性将已命名外观显式应用于控件。通过创建已命名外观,可以为应用程序中同一控件的不同实例设置不同的外观。
3、如何为相同控件定义不同的Skin
使用SkinID为控件定义不同的skin,例如
<asp:Label runat=server Text="ThemedLabel" BackColor="Red" /> -label的缺省外观 <asp:Label runat=server SkinId="BoldLabel" Text="ThemedLabel_WithSkinId" BackColor="Blue" Font-Bold="true" /> - 命名为BoldLabel 的Label外观
因此页面没有指定SkinId的label自动应用缺省外观,Label的SkinID设置为BoldLabel的Label控件应用BoldLabel外观
4、如何组织主题文件内容
Theme文件下可以包含多个.Skin文件,所以可以多种方式组织你的主题文件,所有的主题文件在应用于页面之前会合并。
· 一个.skin文件包含所有的控件的外观定义
· 每个控件一个.skin文件
· 相同SkinID的控件放在一个.skin文件中
5、有没有办法定义好的Theme文件在多个程序中共享
服务器上的任何网站以及任何网站中的任何页面都可以引用全局主题,使用全局的主题可以在各个应用程序之间共享,例如你想创建一个全局共享的主题theme1。IIS 服务器上的全局主题放置位置类似于 Inetpubwwwrootaspnet_clientsystem_webv2.0.xxxxxThemesTheme1
应用程序级别的主题会覆盖全局的主题,例如你在应用程序中也定义了Theme1的主题,那么在应用程序级的Theme1主题将覆盖全局的主题Theme1
6、StyleSheetTheme是什么
主题还可以包含级联样式表(.css 文件)。将 .css 文件放在主题目录中时,样式表自动作为主题的一部分应用。使用文件扩展名 .css 在主题文件夹中定义样式表。设置页面的 StyleSheetTheme 属性将主题作为样式表主题来应用。如果您希望能够设置页面上的各个控件的属性,同时仍然对整体外观应用主题,则可以将主题作为样式表主题来应用。EnableTheming="false"情况下StyleSheetTheme仍然有效。通过重写属性StyleSheetTheme来动态修改页面上的主题样式
public override string StyleSheetTheme
{
get{ retrun "MyStyleSheetTheme"; }
}
7、主题(Theme/Skin)资源
一组相当不错的Theme,可以直接应用的项目开发中
Theme预览:http://www.dotnettreats.com/SampleThemes/Default.aspx Theme下载:http://www.dotnettreats.com/tools/Default.aspx
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Yii框架日志操作图文与实例详解
- Flutter 实现虎牙/斗鱼 弹幕功能
- Yii框架中用response保存cookie,用request读取cookie的原理解析
- Yii框架操作cookie与session的方法实例详解
- php中钩子(hook)的原理与简单应用demo示例
- flutter仿微信底部图标渐变功能的实现代码
- Flutter 插件url_launcher简介
- Laravel框架查询构造器 CURD操作示例
- androidx下的fragment的lazy懒加载问题详解
- Thinkphp5框架简单实现钩子(Hook)行为的方法示例
- Android PhoneWindowManager监听屏幕右侧向左滑动实现返回功能
- Laravel框架创建路由的方法详解
- Android 进度条 ProgressBar的实现代码(隐藏、出现、加载进度)
- 解决Laravel blade模板转义html标签的问题
- laravel 配置路由 api和web定义的路由的区别详解