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

王朝html/css/js·作者佚名 2008-05-19

当对一个对象使用“Glow”属性后，这个对象的边缘就会产生类似发光的效果。它的表达式如下：

Filter：Glow（Color=color，Strength=strength）

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

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

<html>

<head>

<title>filter glow</title>

<!--

.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>

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