频道直达 - 专题 - 新闻 - 技巧 - 组网 - 开发 - 安全 - web编程 - 图像 - 操作系统 - 数据库 - 教育 - 旅游 - 健康 - 时尚 - 驱动 - 软件 - 游戏 - 多媒体 - ERP - 讨论组

实例详解CSS滤镜(6)Glow属性

来源: 作者: 出处:巧巧读书 2006-10-25 进入讨论组
访问地址 http://www.qqread.com/css/u266594.html
  当对一个对象使用“Glow”属性后,这个对象的边缘就会产生类似发光的效果。它的表达式如下:

  Filter:Glow(Color=color,Strength=strength)


  Glow属性的参数只有两个:Color是指定发光的颜色,Strength指定发光的强度,参数值从1到255。 让我们先来看一下加上Glow属性的效果图:


实例详解CSS滤镜(6)Glow属性


  怎么样,是不是有一种燃烧的火焰的感觉。实现这种效果的代码如下:


  <html>
    <head>
    <title>filter glow</title>
    <style>//*开始设置CSS样式*//
    <!--
    .leaf{position:absolute; top:20; width:400;
       filter:glow(color=#FF3399,strength=15);}
    //*设置类leaf,绝对定位,Glow滤镜属性,发光颜色值为#FF3399,强度为
    15*//
    .weny{position:absolute; top:70; left:50; width:300;
       filter:glow(color=#9966CC,strength=10);}
    //*设置类weny,绝对定位,glow滤镜属性,发光颜色值为#9966CC,强度为
    15*//
    -->
    </style>
    </head>
    <body>
    <div class=“leaf”>//*leaf类样式*//
    <p style=“font-family:lucida handwriting;
         font-size:54pt;font-weight:bold;color:#003366;”>
    Leaf Mylove</p>//*设置字体名称、大小、粗细、颜色*//
    </div>
    <div class=“weny”>//*weny类样式*//
    <p style=“font-family:bailey; font-size:48pt;
         font-weight:bold;color:#99CC66;”>
    //设置字体名称、大小、粗细、颜色*//
    Weny Good!</p>
    </div>
    </body>
  </html>


  您还可以随意修改颜色值,看看其他的发光效果是怎样的。

更多文章 更多内容请看Photoshop滤镜教程专题,或进入讨论组讨论。
收藏此文】【 】【打印】【关闭
较早的文章:HTML教程-段落标签

较新的文章:CSS文本:ruby-position
相关图文阅读
频道图文推荐
健 康 咨 询
时 尚 咨 询
巧巧读书宗旨
相关专题
最新论坛文章
站内各频道最新更新文档
站内最新制作专题
热门关键字导读
Photoshop教 程照片处理 照片制作 PS快捷键 抠图
计 算 机 故 障XP系统修复
艺 术 与 设 计设计 流媒体 设计欣赏 边框
计 算 机 安 全ARP
站内频道文章精选
巧巧电脑频道编辑信箱  告诉我们您想看的专题或文章