preserveAlpha
Атрибут preserveAlpha указывает, как элемент <feConvolveMatrix> обрабатывает альфа-прозрачность.
Вы можете использовать этот атрибут со следующими элементами SVG:
Пример
html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <filter id="convolveMatrix1" x="0" y="0" width="100%" height="100%"> <feConvolveMatrix kernelMatrix="1 -1 2 0 0 0 0 0 -2" preserveAlpha="true" /> </filter> <filter id="convolveMatrix2" x="0" y="0" width="100%" height="100%"> <feConvolveMatrix kernelMatrix="1 -1 2 0 0 0 0 0 -2" preserveAlpha="false" /> </filter> <image href="mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolveMatrix1);" /> <image href="mdn_logo_only_color.png" width="200" height="200" style="filter:url(#convolveMatrix2); transform:translateX(220px);" /> </svg>
Примечания к использованию
| Значение по умолчанию | false |
|---|---|
| Значение |
true | false
|
| Анимируемо | Да |
true-
Это значение указывает, что свёртка применяется только к цветовым каналам. В этом случае фильтр временно удаляет предумножение альфы из значений цветового компонента, применяет ядро и затем повторно применяет предумножение альфы как заключительный шаг.
false-
Это значение указывает, что свёртка применяется ко всем каналам, включая альфа-канал.
Спецификации
Совместимость с браузерами
| Рабочие столы | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
preserveAlpha |
6 | 79 | 3 | 15 | 6 | 18 | 4 | 14 | 6 | 1.0 | 4.4 |
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/preserveAlpha