在Microsoft Expression Web Designer中使用CSS
Using CSS in Microsoft Expression Web Designer
问题
用Microsoft Expression Web Designer设计页面并充分利用其CSS特性。
方法
和Dreamweaver一样，Microsoft Expression Web Designer允许您添加外部样式表，新建样式表，在HTML页面中加入样式，如图1-45~1-47所示。下面是添加CSS的一些方法：
l 点击Microsoft Expression Web Designer 的应用样式任务面板上的粘贴样式表按钮，导入外部样式表。
l 点击新建文档图标，然后点击CSS按钮新建一个空白的CSS文档。
l 用编辑word文档的方式编辑网页，Microsoft Expression Web Designer会自动添加内部样式。
l 在代码视图中键入样式。
图1-45：在Microsoft Expression Web Designer使用Apply Styles任务面板添加外部样式表
图1-46：在Microsoft Expression Web Designer中创建新的CSS文件
图1-47：在Microsoft Expression Web Designer使用Manage Styles任务面板管理样式
讨论
Microsoft Expression Web Designer对CSS的支持全面地超越了它的前身——FrontPage。向网页中添加样式后，打开Manage Styles任务面板可以查看当前样式列表，还可以从外部CSS切换到内部CSS样式，反之亦然。
假如您用格式工具栏在HTML页面内容中加入样式，应用程序会自动加入内联样式表。当您为选定的文本字选择字体或颜色时，Expression Web Designer会创建一个内部样式表代替使用<font>标签。在FrontPage中，代码如下所示：
<font face="georgia, times new roman, serif" color="#ff0000"
size="2">This is text.</font>
假如您改动了FrontPage中的代码，应用程序会自动把代码量加倍，如下所示：
<font face="georgia, times new roman, serif" color="#ff0000"
size="2"><font face="times new roman, serif">This is text.</font></font>
这会使IE之外的浏览器无法正确地渲染页面，导致代码冗余页面臃肿。Expression Web Designer则不存在图1-48中的代码自动加倍的问题。此外，可以按顺序或类型将样式分类以便于查看。
图1-48：给文本添加样式时，Expression Web Designer自动会创建内部样式
其他
Microsoft Expression Web Designer 之CSS旅程见网址：http://www.microsoft.com/products/ expression/en/Web_ designer/demos.mspx。