<feBlend>
<feBlend> SVG 濾鏡圖元根據特定的混合模式將兩個物件組合在一起。這類似於在影像編輯軟體中混合兩個圖層時已知的功能。混合模式由 mode 屬性定義。
與其它濾鏡圖元一樣,它預設在 linearRGB 顏色空間中處理顏色分量。您可以使用 color-interpolation-filters 屬性改為使用 sRGB。
使用語境
屬性
DOM 介面
此元素實現了 SVGFEBlendElement 介面。
示例
SVG
html
<svg
width="200"
height="200"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<filter id="spotlight">
<feFlood
result="floodFill"
x="0"
y="0"
width="100%"
height="100%"
flood-color="green"
flood-opacity="1" />
<feBlend in="SourceGraphic" in2="floodFill" mode="multiply" />
</filter>
</defs>
<image
href="mdn_logo_only_color.png"
x="10%"
y="10%"
width="80%"
height="80%"
filter="url(#spotlight)" />
</svg>
結果
規範
| 規範 |
|---|
| 濾鏡效果模組第 1 級 # feBlendElement |
瀏覽器相容性
載入中…