文档介绍：第8章中的样式,主题和母版页
的页面创作技术,现如今的网页网站、Web Base应用程序越来越注重页面的外观和可操作性。一致的外观能给用户良好的印象,并能充份展示企业的形象和文化内涵。提供了多种用于统一页面外观的方法,主要有:
样式:CSS标准的一部分,中才有的技术, Web项目提供一致的格式外观。
主题:主题可以为Web服务器控件提供一致的外观设置,与样式属于相同的技术,但主题只针对服务器控件。
母版页:母版页用于定义网站的一致性布局。
下面将从样式开始,中用于统一风格的几个技术。
中应用CSS样式
随着Web的越来越盛行,Web设计也越来越趋向于整体与结构化。在早期,比如在1999年以前,Web站点的设计者们使用HTML语法来格式化显示样式,这种方式具有多种限制,比如在不同的浏览器中的显示效果不一致、缺乏标准的支持、HTML代码结构混乱等等。
解决这些问题的方案是使用CSS标准,CSS支持所有现代的浏览器,并且提供了一整套统一的格式化属性,可以应用这些属性到任何的HTML元素上,比如添加边框、设置字体等等。CSS技术是Web标准的主要表现层技术,除了设置一些外观之外,现如今很多符合Web标准的站点都使用CSS来进行页面的布局。要设计一个标准的Web站点,应该多考虑使用CSS而较少的利用HTML的标签格式化语法。
创建样式
中,可以创建三种类型的样式:
内联样式直接放到HTML标签的内部,这种形式的样式会导致HTML代码的混乱。内联样式示例代码如下所示。
<p style="color:White; background:Blue; font-size:x-large; padding:10px">这行文本显示为蓝色的背景.</p>
放置在Web标签页的<head>区中的样式的集合。可以使用来自样式表的样式来格式化Web控件。使用内联样式,让格式与内容清楚的分离,并且可以对同一页面的格式进行多次重用。
与内部样式相似,但是样式放在一个单独的文件中,这样开发人员可以在应用程序的多个页面上应用相同的样式。
应用样式
现在己经创建好了CSS样式表文件,并定义了CSS样式规则。下面来为Web页面应用样式。VS2008中提供了一些非常实用的工具,用来非常精细的控制和修改CSS样式。
,可以直接将样式表文件拖动到设计视图即可,VS2008将生成如下所示的代码:
<link href="" rel="stylesheet" type="text/css" />
现在两个div将自应用样式效果,。也可以打开VS2008中新增的样式管理窗口来附加一个样式表文件,选择VS2008主菜单中的“视图|管理样式”菜单项,将弹出管理样式窗口,在该窗口中即可以新建样式也可以附加一个外部样式表文件,。
主题
读者一定非常了解Windows主题,当选择不同的主题设置时,Windows用户界面将会发生很大的变化。提供了同样的主题的技术,这让用户可以对Web站点进行统一的控制,很多Blog站点都提供了主题选择功能,当选择不同的主题时会发现页面的很多方面发生了变化,比如控件的显示,页面的布局等等。很多初学者容易混淆主题与CSS的区别,CSS用于控制HTML格式的呈现,服务器控件的很多属性,一些属性可能会生产生不一样的HTML输出。
创建主题
中创建主题,需要先创建一个名为App_Themes的主题文件夹用来存放主题,该文件夹必须位于应用程序的根目录中。在该文件夹中可以存放多个主题设置。每个主题必须用一个单独的子文件夹进行存放。
网站,应用程序创建主题,步骤如下所示。
创建命名皮肤
在上一节中为TextBox控件创建了一个皮肤,当在页面上应用主题后,会发现所有的TextBox控件的呈现外观都发生了改变,这种皮肤称为默认皮肤。开发人员可能想为某个指定的TextBox控件应用一种不同的皮肤,此时可以考虑使用命名皮肤。
创建命名皮肤与创建默认皮肤类似,唯一不同点是需要为命名皮肤指定一个SkinID属性,用于命名一个皮肤。
注意:在一个皮肤文件中,可以有多个命名的皮肤文件,但是只能具有一个默认的皮肤文件。
,代码如下所示。
<asp:TextBox BackColor="Yellow" BorderStyle="Dotted" Runat="Server" />
<asp:TextBox SkinID="NamedSkin" BorderStyle="Dashed"