在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
主题由外观, 级联样式表(CSS), 图像和其它资源组成, 主题中至少包含外观. 他是在网站或Web服务器上的特殊目录中定义的: 外观: 外观文件是主题的核心内容, 用于定义页面中服务器控件的外观, 它包含各个控件(如Button, TextBox 或 Calendar控件)的属性设置. 控件外观设置类似于控件标记本身, 但只包含要作为主题的一部分来设置的属性. 例如, 下面的TextBox控件的外观代码: <asp:TextBox runat="server" BackColor="PowderBlue" ForeColor="RoyalBlue" /> 控件外观的设置与控件声明代码类似. 在控件外观设置中只能包含作为主题的属性定义. 上述代码中设置了TextBox控件的前景色和背景色属性. 如果将以上控件外观应用到单个web页面上, 那么页面内所有TextBox控件都将显示所设置的控件外观. 级联样式表: 主题还可以包含级联样式表(.css文件). 将.css文件放在主题目录中时, 样式表自动作为主题的一部分应用. 使用文件扩展名.css在主题文件夹中定义样式表. 主题中可以包含一个或多个级联样式表. 图像和其它资源: 主题还可以包含图像和其它资源, 如脚本文件或视频文件, 通常, 主题的资源文件与该主题的外观文件位于同一个文件夹中. 但也可以在Web应用程序中的其它地方. 例如主题目录下的某个子文件夹中的文件 ============================================================================================ 文件存储和组织方式 在Web应用程序中, 主题文件必须存储在根目录的App_Themes文件夹下(除全局主题之外), 开发人员可以手动或者使用VS工具创建该文件夹, 创建完成后, 如下图: 外观文件是主题的核心部分, 每个主题文件夹下都可以包含一个或多个外观文件, 如果主题较多, 页面内容复杂时, 外观文件的组织就会出现问题, 此时就需要开发人员在开发过程中, 根据实际情况对外观文件进行有效的管理. 通常根据SkinID. 控件类型 及文件 这三种方式组织:
外观文件分为默认外观和已命名外观两种类型, 如果控件外观没有包含SkinID属性, 那么就是默认外观. 此时, 向页面应用主题, 默认外观自动应用于同一类型的所有控件. 已命名外观是设置了SkinID属性的控件外观, 已命名外观不会自动按类型应用于控件, 而应当通过设置控件的SkinID属性将已命名外观显示应用于控件. 通过创建已命名外观, 可以为应用程序中同一控件的不同实例, 设置不同的外观
创建一个简单的默认外观和命名外观实例: 1. 新建任意一个项目, 添加主题文件夹, 修改默认名称:
2. TextBoxSkin.skin文件代码如下: TextBox的默认外观—-这行是不能有的, 否则会报错 <asp:TextBox runat="server" Text="文本框外观1" BackColor="#FFE0C0" BorderColor="#FFC080" Font-Size="12pt" ForeColor="#C04000" Width="149px"/> 带有SkinID属性的是命名外观—-这行是不能有的, 否则会报错 <asp:TextBox SkinId="textboxSkin" runat="server" Text="文本框外观2" BackColor="#FFFFC0" BorderColor="Olive" BorderStyle="Dashed" Font-Size="15pt" Width="224px"/> 任何控件的ID属性都不可用在外观文件中出现, 如果向外观文件中添加了不能设置主题的属性, 将会发生错误. 3. Default.aspx调用代码如下: <table> <tr> <td style="width: 100px"> 默认外观:</td> <td style="width: 247px"> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></td> </tr> <tr> <td style="width: 100px"> 命名外观:</td> <td style="width: 247px"> <asp:TextBox ID="TextBox2" runat="server" SkinID ="textboxSkin"> </asp:TextBox></td> </tr> </table> 4. 最终效果图:
|
2023-10-27
2022-08-15
2022-08-17
2022-09-23
2022-08-13
请发表评论