动网论坛,站长建站首选,国内使用量最多的论坛软件 动网论坛官方技术讨论区 站长工具 申请属于您自己的免费论坛
首页 | 新闻资讯 | 网站运营 | 网络编程 | 数据库 | 服务器 | 网页设计 | 图像媒体 | 网络应用 | 搜索优化 | 资源下载 | 动网主机 | DVBOX
    本站内  互联网 ASP论坛  ASP.Net论坛  PHP论坛
  
   DreamWeaver → 阅读文章

 DW MX 2004 CSS属性详解之DROPSHADOW属性

作者来源: 
阅读 数 664 人次 , 2006-3-29 4:49:00 


【dropshadow属性】作用是添加对象的阴影效果。实际效果看上去就象是原来的对象离开了页面,然后在页面上显示出该对象的投影。其工作原理是建立一个偏移量,然后加上颜色。下面我们看一下使用该滤镜来做的带阴影的文字效果:

带阴影的文字

  制作方法如下:
  创建新的css样式:(要回顾创建新的 css 样式操作方法,请点页顶导航条“简要说明”按钮)

  提示:新创建的css样式名称,输入“drop”。勾选“仅对该文档”。保存后,在分类选项选择“扩展”,再设置“过滤器”。
  选择“dropshadow"并按括号中的参数值设置(dropshadow(color=#ff0000, offx=5, offy=5, positive=1)),按“确定”结束。 若是操作无误的话,在你网页代码的< head >与< /head >之间,会有如下所示的代码:

<style type="text/css">
<!--
.drop {
filter: dropshadow(color=#999999, offx=5, offy=5, positive=true);
}
-->
</style>


 dropshadow滤镜有四个参数,它们的含义为:
   “color”:代表投射阴影的颜色。
   “offx”和“offy”:分别是x方向和y方向阴影的偏移量,它必须用整数值,如果是正整数,那么表示阴影向x轴的右方向和y轴的下方向。若是负整数值,阴影的方向正好相反。另外“offx”和“offy”数值的大小决定了阴影离开对象的距离;
   “positive”参数:如果为“true(非0)”,那么就为任何的非透明像素建立可见的投影。如果为“fasle(0)”,那么就为透明的像素部分建立透明效果。


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


   dropshadow滤镜对一般图片无效,但我们把图片放到表格中,再给表格的<td>加载dropshadow滤镜,将会产生一种图片有了立体边框的效果,如下图所示:


  注:该效果所使用的dropshadow滤镜参数和上边字体的参数一致。

 本文TagsHTML/CSS  dreamweaver  photoshop  
 收藏本文  打印本文  论坛讨论  关闭窗口
· 上一篇:DW MX 2004 CSS属性详解之FLIPH属性
· 下一篇:DW MX 2004 CSS 属性详解之CHROMA 属性
· Dreamweaver MX 2004打造留言本
· DW MX 2004 CSS属性详解之DROPSHADOW属性
· DW滑动菜单的制作
· DW MX 2004 之 Flash Element
· DW MX 2004新功能:加密FTP


关于本站 | 联系我们 | 业务合作 | 客户案例 | 诚聘英才 | 广告合作 | 收藏本站
海口动网先锋网络科技有限公司版权所有
Copyright © 2000 - 2006 Cndw.Com
中华人民共和国电信与信息服务业务经营许可证编号 琼 ICP 020077