2011-08-08 49 views
8

酷酷,我刚刚意识到在CSS中有一种叫flood-colorlighting-color的东西。有谁知道flood-colorlighting-color是什么,他们做什么?什么是CSS中的泛光颜色和灯光颜色定义?

究竟做这些的意思是?:

的“洪水色”属性指示要使用什么颜色充斥 当前过滤原始分区。关键字currentColor和ICC 颜色可以用与'fill'和'stroke'属性的 规范中相同的方式指定。

“照明颜色”属性定义滤镜基元“feDiffuseLighting”和“feSpecularLighting”的光源 的颜色。

我们该如何应用这些所谓的SVG的影响?我已经尝试将照明颜色设置为红色,但似乎没有任何影响。

回答

8

这些是SVG滤镜效果。

在“照明色”属性定义光源 的用于过滤原语“feDiffuseLighting”和“feSpecularLighting”的颜色。

http://www.w3.org/TR/SVG/filters.html#LightingColorProperty

在“洪水不透明度”属性定义跨越 整个过滤器原语子区域使用不透明度值。

http://www.w3.org/TR/SVG/filters.html#FloodColorProperty

+0

做自己喜欢的背景渐变的SVG影响工作?或者更确切地说,我们如何应用它?我试着将它们设置为不同的有效颜色值,但没有一个显示任何形式的差异 – Pacerier

3

该规范是不是很有益的,当我看到这件事。
尝试https://developer.mozilla.org/en-US/docs/Applying_SVG_effects_to_HTML_content

有你可以申请三种风格:你可以使用面膜,夹路径,或过滤器。

我唯一需要使用它的时候是我想用XOR反转图形。

定义SVG滤镜:

<svg> 
    <filter id="xor" x="0" y="0" width="100%" height="100%"> 
     <feFlood flood-color="#ff1493" result="flood"/> 
     <feComposite operator="xor" in="SourceAlpha" in2="flood"/> 
    </filter> 
</svg> 

应用使用CSS:

<style> 
    .stylename{ 
     mask: url(#xor); 
    } 
</style>