Dreamweaver之CSS扩展属性.doc

Dreamweaver之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种动态效果中随机抽用其中的一种。用它来进行网页之间的动态切换，非常方DW滤镜样式的语法规则程序代码style=filter:滤镜名(属性1值1,属性2值2.)其中，“滤镜名”就是你在DW样式设置模块的滤镜下拉列表中看到的名称，属性值只需填入数字即可。下面是DW所提供的主要几个滤镜的功能说明：下面是主要滤镜资料包括功能、语法、属性意义、简单例子及应用说明：1.滤镜:alpha 设置透明层次语法: STYLE=filter:Alpha(Opacity=opacity,FinishOpacity=finishopacity,Style=style,StartX=startX,StartY=startY,FinishX=finishX,FinishY=finishY) 说明： Opacity：透明度级别，范围是0-100，0代表完全透明，100代表完全不透明。FinishOpacity：设置渐变的透明效果时，用来指定结束时的透明度，范围也是0 到 100。Style：设置渐变透明的样式，值为0代表统一形状、1代表线形、2代表放射状、3代表长方形。StartX和StartY：代表渐变透明效果的开始X和Y坐标。FinishX和FinishY：代表渐变透明效果结束X和Y 的坐标。例子：filter:Alpha(Opacity=0,FinishOpacity=40,Style=2)2.滤镜:blur 创建高速度移动效果，即模糊效果语法: STYLE=filter:Blur(Add=add,Direction=direction,Strength=strength) 说明： Add：是否单方向模糊，此参数是一个布尔值，true（非0）或false（0）。一般为1，或0。Direction：设置模糊的方向，其中0度代表垂直向上，然后每45度为一个单位，0-315度，步长为45度。Strength：代表模糊的象素值，Strength:效果增长的数值,一般5即可. 例子：filter:Blur(Add=1,Direction=45,Strength=5)3.滤镜:Chroma 制作专用颜色透明语法: STYLE=filter:Chroma(Color=color) 说明: color:#rrggbb格式，任意. 例子：filter:Chroma(Color=#FFFFFF)4.滤镜:DropShadow 创建对象的固定影子语法: STYLE=filter:DropShadow(Color=color,OffX=offX,OffY=offY,Positive=positive) 说明: Color：指定阴影的颜色。Color:#rrggbb格式，任意.OffX：指定阴影相对于元素在水平方向偏移量，整数。OffY：指定阴影相对于元素在垂直方向偏移量，整数。Positive：是一个布尔值，值为true（非0）时，表示为建立外阴影；为false(0)，表示为建立内阴影。Positive:1或0. 例子：filter:DropShadow(Color=#6699CC,OffX=5,OffY=5,Positive=1) 05.滤镜:FlipH 创建水平镜像图片语法: STYLE=filter:FlipH 例子：filter:FlipH6.滤镜:FlipV 创建垂直镜像图片语法:STYLE=filter:FlipV 例子：filter:FlipV7.滤镜:Glow 加光辉在附近对象的边外语法: STYLE=filter:Glow(Color=color,Strength=strength) 说明: Color:发光颜色. Strength:强度(0-100) 例子：filter:Glow(Color=#6699CC,Strength=5)8滤镜:Gray 去掉图像的色彩，显示为黑白图象即图片灰度化语法: STYLE=filter:Gray 例子：filter:Gray9.滤镜:Invert 反转图象的颜色，产生类似底片的效果语法: STYLE=filter:Invert 例子：filter:Invert10.滤镜:Light 放置光源的效果，可以用来模拟光源在物体上的投影效果语法:STYLE=filter:Light 例子：filter:Light11.滤镜:Mask 创建透明掩膜在对象上，即建立透明遮罩语法:STYLE=filter:Mask(Color=color) 例子：filter:Mask(Color=#FFFFE0)12.滤镜:Shadow 创建偏移固定影子语法:filter:Shadow(Color=color,Direction=direction) 说明: Color：是指阴影的颜色。Color:#rrggbb格式.Direction：是设置投影的方向，0度代表垂直向上，然后每45度为一个单位。 例子：filter:Shadow(Color=#6699CC,Direction=135)13.滤镜:Wave 波纹效果语法: filter:Wave(Add=add,Freq=freq,LightStrength=strength,Phase=phase,Strength=strength) 说明: Add：表示是否显示原对象，0表示不显示，非0表示要显示原对象。Freq：设置波动的个数。LightStrength：设置波浪效果的光照强度，从0到100。0表示最弱，100表示最强。Phase：波浪的起始相角。从0到100的百分数值。（例如：25相当于90度，而50相当于180度。）Strength：设置波浪摇摆的幅度。例子:filter:wave(Add=0,Phase=4,Freq=5,LightStrength=5,Strength=2) 14.滤镜:Xray 使对象变的像被x光照射一样语法: STYLE=filter:Xray 例子:filter:Xray 015. RevealTrans动态滤镜，建立切换效果语法:RevealTrans(Duration=?, Transition=?)说明:Duration：是切换时间，以秒为单位。Transtition：是切换方式，可设置为从0到23。CSS的RevealTrans动态滤镜是一个神奇的滤镜