2011-08-08 13 views
8

私は、CSSにflood-colorlighting-colorと呼ばれるものがあることを知りました。誰もがflood-colorlighting-colorを知っていますか?彼らは何をしていますか?正確に?:CSSのフラッドカラーとライティングカラーの定義は何ですか?

「洪水色」プロパティこれらの意味何

は 現在のフィルタプリミティブ部分領域をあふれさせるために使用することが何色を示しています。キーワードcurrentColorおよびICC の色は、 'fill'および 'stroke'プロパティの 仕様内と同じ方法で指定できます。

'lighting-color'プロパティは、フィルタプリミティブ '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

スペックは非常に有用ではなかったです。
はあなたが適用される場合があります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> 
関連する問題