中国IT动力,最新最全的IT技术教程
最新100篇 | 推荐100篇 | 专题100篇 | 排行榜 | 搜索 | 在线API文档 | 网通镜像
首 页 | 程序开发 | 操作系统 | 软件应用 | 图形图象 | 网络应用 | 精文荟萃 | 教育认证 | 硬件维护 | 未整理篇 | 站长教程
ASP JS PHP工程 ASP.NET 网站建设 UML J2EESUN .NET VC VB VFP 网络维护 数据库 DB2 SQL2000 Oracle Mysql
服务器 Win2000 Office C DreamWeaver FireWorks Flash PhotoShop 上网宝典 CorelDraw 协议大全 网络安全 微软认证
硬件维护  CPU  主板  硬盘  内存  显卡  显示器  键盘鼠标  声卡音箱  打印机  机箱电源  BIOS  网卡  C#  Java  Delphi  vs.net2005
  当前位置:> 图形图象 > 网页设计 > DreamWeaver
Dreamweaver打造多彩文字链接(4)
作者:佚名 时间:2005-04-19 11:14 出处:互连网 责编:chinaitpower
              摘要:Dreamweaver打造多彩文字链接(4)

   四、 高级链接样式

  通过组合应用上面介绍的技术,我们还可以创作出更复杂的文字链接样式,下面我们介绍三个例子。

  1、 定义块状链接。首先给链接增加一个背景色,如图十八;
  

  再为文字链接增加四边框即可实现平面块状文字链接,如图十九;
  
 
    2、 定义按钮状文字链接。改变边框的样式,定义Border-Style为outset,如图二十;
  

  定义Box选项中的Width和Height可以定义按钮的宽和高,定义Padding为2pix可以使链接文字与按钮四周有2pix的间距,如图二十一;   

  3、 定义特效文字链接。CSS样式表中还包含了一组特效滤镜,我们可以再结合滤镜与前边的参数创建特殊的链接样式。本例中我创建了一个使用Blur滤镜的文字链接,并带有边框效果。如图二十二;
  

  4、 定义静态背景切换的效果。本例是通过对链接文字普通状态和Hover状态设定不同的背景图片来实现背景切换的效果。见下图:   

  5、 动态背景切换的效果。此效果与上例基本一样,只是在Hover状态定义了一个动态Gif图片背景。而且这个图片需要一点技巧就是设定循环为一遍,并在最后添加一个帧,设定帧的时间为一个较大的值,如10000。这样可以执行一边后就停止。为改善效果执行时的速度,我们还需要增加了一个Preload /doc/webpage/images/images行为。这需要打开行为面板,并添加Preload /doc/webpage/images/images行为,如图:
  
  
  我们可以把最后两种链接样式所需要用到的四张图片都预先载入,如下图:  
  

    五、 总结

  我就介绍这么多链接样式,配合设置链接文字的hover状态,可以实现非常漂亮的效果,希望朋友们根据上面的思路,组合创造出更多地链接文字样式。记住,样式表就好比网页制作中具有宝藏的一个冰山,今天我们只是揭开了冰山小小的一个角落,更多的宝藏等着你去挖掘。
关闭本页
 
首页 | 投资与合作 | 服务条款 | 隐私政策 | 收藏本站 | 设为首页 | 新用户注册 | 免责声明 | 使用帮助
Copyright ©2005-2008 chinaitpower.com All rights reserved. www.chinaitpower.com 版权所有