欢迎光临
我们一直在努力

用Dreamweaver实现飘浮光球特效-网页设计,Dreamweaver

建站超值云服务器,限时71元/月

    大家都知道,dreamweaver是一款专业的网页设计工具,提供了许多方便、实用的功能,使得以前许多网页效果的实现从繁琐的代码中解脱出来,只要轻点鼠标即可实现。其中为网页图像增添特效就是其具有特色的功能之一,利用它可以为图像添加诸如阴影、运动、波浪、及淡入淡出等特效。这种特效不会增加图像的大小,当然也不会影响其下载速度。其具体的实现方法如下:

1、在dreamweaver编辑窗口中,点击菜单命令“window/css styles”打开样式浮动面板,在浮动面板中点击右键菜单中的“new style”选项或者点击右下角带“+”的按钮,打开新增样式对话框(如图1),在“name”栏中输入新增特效名称,并选择type的第一个选项:“make custom style”,然后点击“ok”按钮,并在出现的保存对话框中输入文件名保存样式文件。


用Dreamweaver实现飘浮光球特效-网页设计,Dreamweaver

图1 填上特效名称

2、在随即出现的样式定义设置对话框中,选择category列表框中的最后一项“extensions”选项(如图2),打开扩展窗口参数设置窗口,其中“page break”选项用于设置样式应用前后的位置,可以不予设置,而“visual effect”下的“cursor”则用于自定义鼠标指针形状,“filter”用于选择效果的类型,共有16个选项。用户选择好效果类型以后,将其中有问号的地方改成自己希望的参数,点击“ok”即完成样式的定义。


用Dreamweaver实现飘浮光球特效-网页设计,Dreamweaver

图2 选择设置参数

3、击菜单“insert/image”打开图片,选择对话框插入希望应用特效的图像,然后在编辑窗口中选中该图像,并点击样式浮动面板中刚才创建的样式,按下“f12”键,在浏览器中即可看到特效显示的最终效果。如图3即为filter类型为“wave”,参数为:“add=1,freq=6,lightstrength=20,phase=8,strength=15”的样式在图片上应用以后的效果对比。


用Dreamweaver实现飘浮光球特效-网页设计,Dreamweaver

图3 最终效果

4、如果用户应用后对效果不很满意的话,可以在样式浮动面板中点击快捷菜单中“edit”选项,重新打开样式定义窗口进行参数设置,直到满意为止。

赞(0)
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com 特别注意:本站所有转载文章言论不代表本站观点! 本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。未经允许不得转载:IDC资讯中心 » 用Dreamweaver实现飘浮光球特效-网页设计,Dreamweaver
分享到: 更多 (0)