Dreamweaver MX 2004 CSS使用教程

　　一.CSS概述

　　如今网页的排版格式越来越复杂，很多效果需要通过CSS来实现，Dreamweaver MX 2004在CSS功能设计上做了很大的改进。今天给大家具体谈谈如何使用Dreamweaver MX 2004 CSS功能，我相信当你看完这个教程之后你会觉得CSS使用是那样的简单，而创作出来的效果却是惊人的。

　　现代网页制作离不开 CSS技术，采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。 用CSS不仅可以做出美观工整令浏览者赏心悦目的网页，还能给网页添加许多神奇的效果。

　　创建CSS样式表的过程，就是对各种CSS属性的设置过程，所以了解和掌握属性设置非常重要。在DW MX 2004的CSS样式里包含了W3C规范定义的所有CSS1的属性，把这些属性分为：类型、背景、区块、方框、边框、列表、定位、扩展等八个部分，如下图：

　　DW MX 2004 实现CSS属性设置功能是完全可视化的，无需编写代码。下面我们分别详细讲解。 为了便于理解，从开始创建新的 CSS 样式表说起：

　　【创建新的 CSS 样式】

　　将插入点放在文档中，然后执行以下操作之一打开“新建 CSS 样式”对话框：

　　在“CSS 样式”面板（“窗口”>“CSS 样式”）中，单击面板右下角区域中的“新建 CSS 样式”按钮，如下图：

　　在文本属性检查器中，从“样式”弹出式菜单中选择“管理样式”，然后在出现的对话框中单击“新建”。

　　在“相关 CSS”选项卡（选择“窗口”>“标签检查器”，然后单击“相关 CSS”选项卡）中右键单击，然后从上下文菜单中选择“新建规则”。

　　选择“文本”菜单>“CSS 样式”>“新建(N)…”。

　　“新建 CSS 样式”对话框随即出现，如下图：

　　定义您要创建的 CSS 样式的类型：

　　若要创建可作为 class 属性应用于文本范围或文本块的自定义样式，请选择“创建自定义样式 (Class)”，然后在“名称”文本框中输入样式名称。

　　注意：类名称必须以句点开头，并且可以包含任何字母和数字组合（例如，.mycss）。如果您没有输入开头的句点，DW MX 2004将自动为您输入。

　　若要重定义特定 HTML 标签的默认格式，请选择“重定义标签”，然后在“标签”字段中输入一个 HTML 标签，或从弹出式菜单中选择一个标签。

　　若要为具体某个标签组合或所有包含特定 Id 属性的标签定义格式，请选择“使用 CSS 选择器”，然后在“选择器”文本框中输入一个或多个 HTML 标签，或从弹出式菜单中选择一个标签。弹出式菜单中提供的选择器（称作伪类选择器）包括 a:active、a:hover、a:link 和 a:visited。

　　选择定义样式的位置：

　　若要创建外部样式表，请选择“新建样式表文件”。

　　若要在当前文档中嵌入样式，请选择“仅对该文档”。

　　单击“确定”。

 

 

　　二.定义CSS的类型属性

　　使用“CSS 样式定义”对话框中的“类型”类别可以定义 CSS 样式的基本字体和类型设置。

　　定义 CSS 样式的类型设置：

　　在“CSS 样式定义”对话框中，选择“类型”（如下图），然后设置所需的样式属性。

　　以下属性如果不设置可以保留为空。

　　字体：为样式设置字体。DW MX 2004内置6个系列的英文字体（如下图）。

　　一般英文字体常常用“Arial， Helvetica， sans-serif”这个系列比较美观，如果不用这些字体系列，你您可以通过下拉列表最下面的“编辑字体列表”来创建新的字体系列。中文网页默认字体是宋体，一般留空即可。浏览器首选用户系统第一种字体显示文本。两种浏览器都支持字体属性。

　　大小：定义文本大小。可以通过选择数字和度量单位选择特定的大小，也可以选择相对大小。以像素为单位可以有效地防止浏览器变形文本。

　　注意：CSS中长度的单位分为绝对长度单位和相对长度单位：（这在CSS入门教程中已经给大家介绍过了）

　　绝对长度：

　　px：（象素）根据显示器的分辨率来确定长度。

　　pt：（字号）根据windows系统定义的字号大小来确定长度。

　　in、cn、mm：（英寸、厘米、毫米）根据显示的实际尺寸来确定长度。此类单位不随显示器的分辨率改变而改变。

　　相对长度：

　　em：当前文本的尺寸。例如：{ font-size:3em}是指文字大小为原来的3倍。

　　ex：当前字母“x”的高度，一般为字体尺寸的一半。

　　%：是以当前文本的百分比定义尺寸。例如：{ font-size:200%}是指文字大小为原来的2倍。

　　样式：将“正常”、“斜体”或“偏斜体”指定为字体样式。默认设置是“正常”。

　　行高：设置文本所在行的高度。选择“正常”自动计算字体大小的行高，或输入一个确切的值并选择一种度量单位。比较直观的写法用百分比，例如200%是指行高等于文字大小的2倍。相对应的CSS属性是”line-height”。

　　修饰：向文本中添加下划线、上划线或删除线，或使文本闪烁。正常文本的默认设置是“无”。链接的默认设置是“下划线”。将链接设置设为无时，可以通过定义一个特殊的类删除链接中的下划线。这些效果可以同时存在，将效果前的复选框选定即可。相对应的CSS属性是”text-decoration”。

　　粗细：对字体应用特定或相对的粗体量。“正常”等于 400；“粗体”等于 700。相对应的CSS属性是”font-weight”。

　　变量：设置文本的小型大写字母变量。DW MX 2004不在“文档”窗口中显示该属性。注意：Internet Explorer 支持变量属性，但 Netscape Navigator 不支持。

　　大小写：将选定内容中的每个单词的首字母大写或将文本设置为全部大写或小写。两种浏览器都支持大小写属性。

　　颜色：设置文本颜色。

　　设置完这些选项后，在面板左侧选择另一个 CSS 类别以设置其它的样式属性，或单击“确定”。

 

 

　　三.定义 CSS 样式背景属性

　　使用“CSS 样式定义”对话框的“背景”类别可以定义 CSS 样式的背景设置。可以对网页中的任何元素应用背景属性。例如，创建一个样式，将背景颜色或背景图像添加到任何页面元素中，比如在文本、表格、页面等的后面。还可以设置背景图像的位置。

　　定义背景设置：

　　在“CSS 样式定义”对话框中，选择“背景”（如下图），然后设置所需的样式属性。

　　如果以下属性不设置可以保持为空。

　　背景颜色：设置元素的背景颜色。两种浏览器都支持背景颜色属性。

　　背景图像：设置元素的背景图像。两种浏览器都支持背景图像属性。

　　重复：定义是否重复以及如何重复背景图像。两种浏览器都支持重复属性。

　　“不重复”在元素开始处显示一次图像。

　　“重复”在元素的后面水平和垂直平铺图像。

　　“横向重复”和“纵向重复”分别显示图像水平带区和垂直带区。图像被剪辑以适合元素的边界。

　　附件：确定背景图像是固定在它的原始位置还是随内容一起滚动。注意，某些浏览器可能将“固定”选项视为“滚动”。注意：Internet Explorer 支持该选项，但 Netscape Navigator 不支持。

　　水平位置：和垂直位置指定背景图像相对于元素的初始位置。这可以用于将背景图像与页面中心垂直和水平对齐。如果附件属性为“固定”，则位置相对于“文档”窗口而不是元素。注意：Internet Explorer支持该属性，但 Netscape Navigator 不支持。

　　设置完这些选项后，在面板左侧选择另一个 CSS 类别以设置其它的样式属性，或单击“确定”。

　　四.定义 CSS 样式区块属性

　　使用“CSS 样式定义”对话框的“区块”类别可以定义标签和属性的间距和对齐设置。

　　定义区块设置：在“CSS样式定义”对话框中，选择“区块”（如下图），然后设置所需的样式属性。

　　如果不设置属性可以保持为空。

　　单词间距：设置单词的间距。若要设置特定的值，请在弹出式菜单中选择“值”，然后输入一个数值。在第二个弹出式菜单中，选择度量单位。

　　注意：可以指定负值，但显示取决于浏览器。Dreamweaver 不在“文档”窗口中显示该属性。

　　字母间距：增加或减小字母或字符的间距。若要减少字符间距，请指定一个负值（例如 -4）。字母间距设置覆盖对齐的文本设置。

　　垂直对齐：指定应用它的元素的垂直对齐方式。仅当应用于 <img> 标签时，Dreamweaver 才在“文档”窗口中显示该属性。

　　文本对齐：设置元素中的文本对齐方式。两种浏览器都支持“文本对齐”属性。

　　文本缩进：指定第一行文本缩进的程度。可以使用负值创建凸出，但显示取决于浏览器。仅当标签应用于块级元素时，Dreamweaver 才在“文档”窗口中显示该属性。两种浏览器都支持“文本缩进”属性。

　　空格：确定如何处理元素中的空白。从下面三个选项中选择：“正常”收缩空白；“保留”的处理方式即保留所有空白，包括空格、制表符和回车；“不换行”指定仅当遇到 <br> 标签时文本才换行。Dreamweaver 不在“文档”窗口中显示该属性。

　　显示：指定是否显示以及如何显示元素。“无”关闭它被指定给的元素的显示。

　　设置完这些选项后，在面板左侧选择另一个 CSS 类别以设置其它的样式属性，或单击“确定”。

 

　　五.定义 CSS 样式方框属性

　　使用“CSS 样式定义”对话框的方框（又称盒子）类别可以为控制元素在页面上的放置方式的标签和属性定义设置。可以在应用填充和边距设置时将设置应用于元素的各个边，也可以使用“全部相同”设置将相同的设置应用于元素的所有边。

　　定义元素在页面上的放置方式：在“CSS 样式定义”对话框中，选择“方框”（如下图），然后设置所需的样式属性。

　　如果不设置属性可以保持为空。

　　宽和高：设置元素的宽度和高度。宽和高定义的对象多为图片，表格，层等。

　　浮动：设置元素浮动方式（如文本、层、表格等）。其它元素按通常的方式环绕在浮动元素的周围。

　　清除：不允许元素的浮动。左对齐：表示不允许左边有浮动对象。右对齐：表示不允许右边有浮动对象。两者：表示允许两边都可以有浮动对象。无：不允许有浮动对象。两种浏览器都支持“清除”属性。

　　填充：指定元素内容与元素边框（如果没有边框，则为边距）之间的间距。取消选择“全部相同”选项可设置元素各个边的填充。

　　全部相同：将相同的填充属性设置为它应用于的元素的“上”、“右”、“下”和“左”侧。

　　边界：指定一个元素的边框（如果没有边框，则为填充）与另一个元素之间的间距。仅当应用于块级元素（段落、标题、列表等）时，DW MX 2004才在“文档”窗口中显示该属性。取消选择“全部相同”可设置元素各个边的边距。

　　全部相同：将相同的边距属性设置为它应用于的元素的“上”、“右”、“下”和“左”侧。

　　设置完这些选项后，在面板左侧选择另一个 CSS 类别以设置其它的样式属性，或单击“确定”。

　　六.定义 CSS 样式边框属性

　　使用“CSS 样式定义”对话框的“边框”类别可以定义元素周围的边框的设置（如宽度、颜色和样式）。

　　设置边框样式：在“CSS 样式定义”对话框中，选择“边框”（如下图），然后设置所需的样式属性。

　　请注意：下列任意属性如果您认为不重要可以保留为空。

　　样式：设置边框的样式外观。样式的显示方式取决于浏览器。DW MX 2004在“文档”窗口中将所有样式呈现为实线。两种浏览器都支持样式属性。取消选择“全部相同”可设置元素各个边的边框样式。

　　全部相同：将相同的边框样式属性设置应用于的元素的“上”、“右”、“下”和“左”侧。

　　宽度：设置元素边框的粗细。两种浏览器都支持“宽度”属性。取消选择“全部相同”可设置元素各个边的边框宽度。

　　全部相同：将相同的边框宽度设置应用于的元素的“上”、“右”、“下”和“左”侧。

　　颜色：设置边框的颜色。可以分别设置每个边的颜色，但显示取决于浏览器。取消选择“全部相同”可设置元素各个边的边框颜色。全部相同：将相同的边框颜色设置应用于的元素的“上”、“右”、“下”和“左”侧。

　　设置完这些选项后，在面板左侧选择另一个 CSS 类别以设置其它的样式属性，或单击“确定”。

 

 

　　七.定义 CSS 样式列表属性

　　“CSS 样式定义”对话框的“列表”类别为列表标签定义列表设置（如项目符号大小和类型）。

　　定义列表样式：在“CSS 样式定义”对话框中，选择“列表”（如下图），然后选择所需的样式属性。

　　如果不设置属性可以保持为空。

　　类型：设置项目符号或编号的外观。两种浏览器都支持“类型”。

　　项目符号图像：可以为项目符号指定自定义图像。单击“浏览”选择图像或键入图像的路径。

　　位置：设置列表项文本是否换行和缩进以及文本是否换行到左边距。

　　设置完这些选项后，在面板左侧选择另一个 CSS 类别以设置其它的样式属性，或单击“确定”。

　　八.定义 CSS 样式定位属性

　　“定位”样式属性使用“层”首选参数中定义层的默认标签，将标签或所选文本块更改为新层。

　　设置层定位属性：在“CSS 样式定义”对话框中，选择“定位”（如下图），然后设置所需的样式属性。

　　如果不设置属性可以保持为空。

　　类型：确定浏览器应如何来定位层。

　　绝对：使用“定位”框中输入的坐标（相对于页面左上角）来放置层。

　　相对：使用“定位”框中输入的坐标（相对于对象在文档的文本中的位置）来放置层。该选项不显示在“文档”窗口中。

　　静态：将层放在它在文本中的位置。

　　显示：确定层的初始显示条件。如果不指定可见性属性，则默认情况下大多数浏览器都继承父级的值。选择以下可见性选项之一：

　　继承：继承层父级的可见性属性。如果层没有父级，则它将是可见的。

　　可见：显示该层的内容，而不管父级的值是什么。

　　隐藏：隐藏这些层的内容，而不管父级的值是什么。

　　Z 轴：确定层的堆叠顺序。编号较高的层显示在编号较低的层的上面。值可以为正，也可以为负。（注：使用“层”面板更改层的堆叠顺序更容易。）

　　溢出（仅限于 CSS 层）：确定在层的内容超出它的大小时将发生的情况。这些属性控制如何处理此扩展，如下所示：

　　可见：增加层的大小，使它的所有内容均可见。层向右下方扩展。

　　隐藏：保持层的大小并剪辑任何超出的内容。不提供任何滚动条。

　　滚动：在层中添加滚动条，不论内容是否超出层的大小。专门提供滚动条可避免滚动条在动态环境中出现和消失所引起的混乱。该选项不显示在“文档”窗口中，并且仅适用于支持滚动条的浏览器。注意：Internet Explorer 和 Netscape Navigator 6 支持此属性。

　　自动：使滚动条仅在层的内容超出它的边界时才出现。该选项不显示在“文档”窗口中。

　　定位：指定层的位置和大小。浏览器如何解释位置取决于“类型”设置。如果层的内容超出指定的大小，则大小值被覆盖。

　　位置和大小的默认单位是像素。对于 CSS 层，还可以指定下列单位：pc（十二点活字）、pt（点）、in（英寸）、mm（毫米）、cm（厘米）、(ems)、(exs) 或 %（父级值的百分比）。缩写必须紧跟在值之后，中间不留空格：例如，3mm。

　　剪辑：定义层的可见部分。如果指定了剪辑区域，可以通过脚本语言（如 JavaScript）访问它，并操作属性以创建像擦除这样的特殊效果。通过使用“改变属性”行为可以设置这些擦除效果。

　　设置完这些选项后，在面板左侧选择另一个 CSS 类别以设置其它的样式属性，或单击“确定”。

 

 

　　九.定义 CSS 样式扩展属性

　　“扩展”样式属性包括过滤器、分页和光标选项，它们中的大部分效果仅受 Internet Explorer 4.0 和更高版本的支持。

　　指定扩展属性：在“CSS 样式定义”对话框中，选择“扩展”（如下图），然后设置所需的样式属性。

　　分页：在打印期间在样式所控制的对象之前或者之后强行分页。选择要在弹出式菜单中设置的选项。此选项不受任何 4.0 版本浏览器的支持，但可能受未来的浏览器的支持。

　　光标：位于“视觉效果”下的“光标”选项，是光标显示属性设置。当指针位于样式所控制的对象上时改变指针图像。选择弹出式菜单（下图）进行设置。 它的详细列表和相关说明。

　　过滤器：又称 CSS滤镜， 对样式所控制的对象应用特殊效果。它把我们带入绚丽多姿的世界。正是有了滤镜属性，页面才变得更加漂亮。DW MX 2004 扩展类过滤器嵌入16项样式属性（如下图），您可以根据您的需要从“过滤器”弹出式菜单中选择并加以设置。

　　下图列出16项滤镜及说明，现在再进一步介绍一下：

　　“Alpha”滤镜：这个名字，在Flash和Photoshop经常见到。它们的作用基本类似，就是把一个目标元素与背景混合。你可以指定数值来控制混合的程度。这种“与背景混合”通俗地说就是一个元素的透明度。

　　BlendTrans滤镜：它的功能也比较单一，就是产生一种精细的淡入淡出的效果。

　　Blur滤镜：把它加载到文字上，产生风吹模糊的效果，类似立体字，这将为你在网页上制作立体字标题带来了方便。也可以把Blur滤镜加载到图片上，能达到用图象处理软件制作的效果。

　　“DropShadow”顾名思义就是添加对象的阴影效果。它的实际效果看上去就象是原来的对象离开了页面，然后在页面上显示出该对象的投影。

　　CSS的无参数滤镜共有六个（FlipH、FlipV、Invert、Xray、Gray和Light），虽然它们没有参数，相对来讲，灵活性要差点，但它们用起来更方便，效果也相当明显。用它们可以使文字或图片翻转、获得图片的“底片”效果，甚至可以制作图片的“X光片”效果。

　　glow滤镜：使对象的边缘就产生类似发光的效果，glow”滤镜制作这种效果操作非常简便。

　　Mask滤镜：可以为网页上的元件对象作出一个矩形遮罩效果。

　　wave滤镜：它的作用是把对象按照垂直的波形样式扭曲的特殊效果。

　　Light滤镜：能产生一个模拟光源的效果，配合使用一些简单的Javascrpt，使对象产生奇特光照的效果。

　　RevealTrans动态滤镜：是一个神奇的滤镜，它能产生23种动态效果，还能在23种动态效果中随机抽用其中的一种。用它来进行网页之间的动态切换，非常方便。

 

 

　　十.CSS 滤境的详细介绍1

　　ALPHA 属性

　　【Alpha滤镜属性】这个名字，在Flash和Photoshop经常见到。它们的作用基本类似，就是把一个目标元素与背景混合。你可以指定数值来控制混合的程度。这种“与背景混合”通俗地说就是一个元素的透明度。通过指定坐标，可以指定点、线、面的透明度。由于“Alpha”滤镜的参数多，我们先来看一下下图：

　　“opacity”：代表透明度程度。范围是从0~100，他们其实是百分比的形式。也就是说，0代表完全透明，100代表完全不透明。

　　“finishopacity”：是一个可选参数，如果想要设置渐变的透明效果，就可以使用他们来指定结束时的透明度。范围也是0 到 100。

　　“style”：指定了透明区域的形状特征。其中0代表统一形状、1代表线形、2代表放射状、3代表长方形。

　　“StartX”和“StartY”：代表渐变透明效果的开始X和Y坐标。

　　“FinishX”和“FinishY”：代表渐变透明效果结束X和Y坐标。

　　BLENDTRANS 属性

　　【BlendTrans属性】淡入淡出的效果滤镜，能产生极精细的图片转换效果。

BlendTrans滤镜功能也比较单一，只有一个参数：Duration（变换时间）。需要借助于 Javascript来调用它的方法来实现转换功能。使用BlendTrans滤镜，首先您要准备几张宽高尺 寸相同的图片，并分别命名，保存在图像目录下，如：images/*.jpg?http://www.xvna.com。如果用4幅的话，分别 取名为：blen1.jpg?http://www.xvna.com； blen2.jpg?http://www.xvna.com； blen3.jpg?http://www.xvna.com；blen4.jpg?http://www.xvna.com。

　　BLUR属性

　　【Blur属性】把Blur滤镜加载到文字上，可产生立体字的效果，加载到图片上，可以产生风吹模糊效果。不仅美化了网页，也为你的网页减轻了分量。

　　下面介绍一下Blur滤镜的参数，以便你灵活应用：

　　Add：是否让Blur滤镜起作用，Add=False(或“0”)时Blur滤镜不起作用，取True（或非“0”值）时Blur滤镜起作用，只有两个值，即true和false；

　　Direction：阴影的方向，取值范围0~360度，45度一个间隔，所以实际上只有八个方向值；

　　Strength：它代表有多少个像素的宽度成为阴影，你也可以简单地理解为阴影的长度。它只能用整数来指定，默认值是5个像素，你可以根据实际需要来指定阴影的长度。我上面的两个图片例子是用的同一个滤镜，Strength是10个像素。同一网页中对不同的对象可以使用不同参数的Blur滤镜，你只要给它们取不同的名称就行了。

　　CHROMA 属性

　　【Chroma属性】　Chroma属性可以设置一个对象中指定的颜色为透明色，它的表达式如下：

　　Filter：Chroma（color=color）

　　这个属性的表达式是不是很简单，它只有一个参数。只需把您想要指定透明的颜色用 Color参数设置出来就可以了。

　　DROPSHADOW 属性

　　【DropShadow属性】作用是添加对象的阴影效果。实际效果看上去就象是原来的对象离开了页面，然后在页面上显示出该对象的投影。其工作原理是建立一个偏移量，然后加上颜色。

　　Dropshadow滤镜有四个参数，它们的含义为：

　　“Color”：代表投射阴影的颜色。

　　“offx”和“offy”：分别是X方向和Y方向阴影的偏移量，它必须用整数值，如果是正整数，那么表示阴影向X轴的右方向和Y轴的下方向。若是负整数值，阴影的方向正好相反。另外“offx”和“offy”数值的大小决定了阴影离开对象的距离；

　　“Positive”参数：如果为“true（非0）”，那么就为任何的非透明像素建立可见的投影。如果为“fasle（0）”，那么就为透明的像素部分建立透明效果。

　　对文字加载Dropshadow滤镜比较方便的办法，是把Dropshadow滤镜加载到文字所在的表格单元格< td >上。文字比较小时，使用Dropshadow的效果不太理想，所以一般用于制作稍大的标题字。

　　Dropshadow滤镜对一般图片无效，但我们把图片放到表格中，再给表格的<td>加载 Dropshadow滤镜，将会产生一种图片有了立体边框的效果。

　　FLIPH 属性

　　【FlipV 属 性】FlipV是一个垂直翻转对象的滤镜，当把FlipV加载到一个对象上，该对象将产生一个垂直镜象，以此来创造垂直翻转的效果；它是无参数滤镜之一。功能单一，使用方便，效果显著。

 

 

　　十一.CSS 滤境的详细介绍2

　　GLOW 属性

　　【glow属性】对象应用glow 滤镜后，这个对象的边缘就会产生类似发光的效果，这种效果在图像处理软件中做起来比较麻烦，而在DW MX 2004中用CSS的“glow”滤镜来制作却是很简单，而且节约不少字节。

　　“glow”滤镜只有两个参数，一个是“color”是指定发光的颜色，另一个参数是 “strength”是发光的强度，也可理解为光芒的长度。取值范围1～255之间的任何整数。下面 我们来做几个应用实例。

　　【glow滤镜在图片上的应用】

　　“glow”滤镜加载到一般图片无效，但若是把图片放到表格中，再给表格的< td >加上“glow”滤镜，却能使图片产生一个渐变颜色的边框。

　　glow滤镜的参数不多，使用简单，效果明显。在具体应用时关键的问题是光芒颜色的选择，要与整个页面色彩协调。给图片和< td >可以用多种方式加载，配合背景的设置，可产生一些奇特的效果。

　　GRAY 属性

　　【Gray 属性】 Gray 滤镜可把一张彩色图片转变为灰度图，即黑白图片。可应用于创意特殊题材，Gray为无参数滤镜，功能单一，操作简单，效果明显。

　　INVERT属性

　　【Invert 属性】 Invert 滤镜可把一张图片转变为负片，好像相片的底片。可应用于创意特殊题材，Invert为无参数滤镜，功能单一，操作简单，效果明显。

　　LIGHT 属性

　　【Light属性】Light滤镜能产生一个模拟光源的效果。可应用于特殊场合，营造奇特的气氛。Light滤镜是无参数滤镜，使用它要通过Javascrpt调用来实现模拟光源的效果。

　　MASK 属性

　　【Mask 属性】Mask滤镜可以为网页元件对象产生一个矩形遮罩效果，实际也可以理解为用一块有色布把物件盖起来，但内容却被挖去了。

　　【Mask滤镜应用】

　　在页面适当位置插入1行1列表格，在表格里输入文字，选择表格的单元格<td>，然后，在属性面板“样式”菜单中选“Mask”。

　　REVEALTRANS 属性

　　RevealTrans是动态滤镜，它能产生23种动态效果，更为奇妙的是它还能在23种动态效果中随机抽取其中一种。

　　RevealTrans滤镜只有两个参数，Duration：是切换时间，以秒为单位；Transition：是切换方式，它有23种方式，详见下图：

　　你只要改变“Transition"的值，就能获得不同的效果。它必须借助于Javascript才能实现，Javascript的设置方法请参考【BlendTrans属性】。

　　SHADOW 属性

　　【Shadow 属性】利用“Shadow”滤镜可以在指定的方向建立物体的投影。投影的颜色可以指定。

　　WAVE 属性

　　【Wave属性】 是把对象按照垂直的波形样式扭曲，而产生一种特殊的效果。 把“wave”滤镜加载到文字上，就可得到波形文字的效果。

　　提示：Wave滤镜共有5个参数：

　　“add”：表示是否要把对象按照波形式样扭曲，它只有两个值，即"true"和"false",默认值是"true（非0）"，当然你也可以修改它的值为"false"（"0"）。

　　“freq”：是波纹的频率，也就是指定在这个对象上面一共需要产生多少个完整的波纹。

　　“lightstrength”：参数可以对于波纹增强光影的效果。它的参数值范围是从0到100的整数值。

　　“phase”：参数用来设置正弦波开始的偏移量。这个偏移量的通用值为0，但是你可以改变它。它的值从0到100之间，这个数值代表开始时的偏移量取自波长的百分比值。 例如如果值为25那么正弦波就从90度的方向开始。

　　“strength”：表示波形的振幅大小，也可以简单的理解为扭曲的程度。

　　XRAY 属性

　　【Xray 属性】 Xray 滤镜可把对象的轮廓显现出来并将其加亮。就象“X光片”一样。可应用于创意特殊题材，Xray为无参数滤镜，功能单一，操作简单，效果明显。

　　应用类样式

　　【应用类样式】是唯一可以应用于文档中任何文本的 CSS 样式类型。与当前文档关联的所有类样式都显示在“CSS 样式”面板中和文本属性检查器的“样式”弹出式菜单中。

　　提示：当预览外部 CSS 样式表中定义的样式时，务必要保存该样式表以确保所做的更改。

　　【应用自定义 CSS 样式】

　　在文档中，选择要应用 CSS 样式的文本。

　　将插入点放在段落中将样式应用于整个段落。

　　如果在单个段落中选择一个文本范围，则 CSS 样式只影响所选范围。

　　若要指定要应用 CSS 样式的确切标签，请在位于“文档”窗口左下角的标签选择器中选择标签。

　　请执行下列操作之一：

　　在“CSS 样式”面板（“窗口”>“CSS 样式”）中，右键单击要应用的样式的名称，然后从上下文菜单选择“套用”。

　　在文本属性检查器中，从“样式”弹出式菜单中选择要应用的类样式。

　　在“文档”窗口中，右键单击所选文本，在上下文菜单中选择“CSS 样式”，然后选择要应用的样式。

　　选择“文本”>“CSS 样式”，然后在子菜单中选择要应用的样式。

　　【将自定义样式从选定内容中删除】

　　选择要删除样式的对象或文本。 执行下列操作之一：

　　在文本属性检查器中，从“样式”弹出式菜单中选择“无”。

　　在“相关 CSS”选项卡中右键单击要删除的已应用规则，然后从上下文菜单中选择“设置类”>“无”。

　　【关于 CSS 样式的冲突】将两个或更多的 CSS 样式应用于同一文本时，这些样式可能发生冲突并产生意外的结果。浏览器根据以下规则应用样式属性：

　　如果将两种样式应用于同一文本，浏览器显示这两种样式的所有属性，除非特定的属性发生冲突。例如，一种样式可能将蓝色指定为文本颜色，而另一种样式可能指定红色作为文本颜色。

　　如果应用于同一文本的两种样式的属性发生冲突，则浏览器显示最里面的样式（离文本本身最近的样式）的属性。因此，如果外部样式表和内联 CSS 样式同时影响文本元素，则应用内联样式。

　　如果有直接冲突，则 CSS 样式（使用 class 属性应用的样式）中的属性将取代 HTML 标签样式中的属性。