MolyX CSS滤镜 Chroma属性

来自站长百科
跳转至： 导航、​ 搜索

导航: 上一页 | 首页 | Discuz | PhpWind | 动网论坛 | vBulletin | phpBB | Discuz!NT

Chroma属性可以设置一个对象中指定的颜色为透明色，它的表达式如下：

Filter：Chroma（color=color）

这个属性的表达式是不是很简单，它只有一个参数。只需把您想要指定透明的颜色用Color参数设置出来就可以了。比如下面这幅图：

Mx32.png

图中显示两种字体，两种颜色，我们现在对“leaves”字体添加chroma属性，使其透明。代码如下： 

<html>
　　　<head> 
　　　<title>chroma filter</title> 
　　　<style> 
　　　<!-- 
　　　 div{position：absolute；top：70；width：200；
　　　　　 filter：chroma(color=green)} 
　　　//*定义DIV范围内绿色为透明色，另外设置DIV的位置*// 
　　　p{font-family：bailey；font-size：48；font-weight：bold；
　　　color：green} //*设置P的字体名称、大小、粗细、颜色*// 
　　　em{font-family:lucida handwriting italic；font-size:48； 
　　　font-weight：bold；color：rgb(255,51,153)} 
　　 //*设置EM的字体名称、大小、粗细、颜色*// 
　　　--> 
　　　</style> 
　　　</head> 
　　　<body> 
　　　<div> 
　　　<p>LEAVES <em>LOVE</em></p> 
　　　</div> 
　　　</body> 
　　</html>

通过上面代码中对chroma的属性设置，使绿色透明。显示效果如下图：

Mx33.png

我们看到绿色的leaves字体不见了，实际上它是透明了，在IE下点击它所在的区域，它还是会显示出来（见下图）：

Mx34.png

另外，需要注意的是，chroma属性对于图片文件不是很适合。因为很多图片是经过了减色和压缩处理（比如JPG、GIF等格式），所以它们很少有固定的位置可以设置为透明。

取自“https://www.zzbaike.com/wiki/index.php?title=MolyX_CSS滤镜_Chroma属性&oldid=26035”