合成と混合

合成と混合 (Compositing and Blending) は CSS モジュールの一つで、様々な要素のシェイプを単一の画像に合成する方法を定義します。

リファレンス

プロパティ

データ型

仕様書

仕様書 状態 備考
Compositing and Blending Level 1 勧告候補 初回定義

ブラウザーの対応

background-blend-mode プロパティ

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
background-blend-modeChrome 完全対応 35Edge 未対応 なし
補足
未対応 なし
補足
補足 EdgeHTML 18 has an Enable CSS background-blend-mode property flag, however the feature is an early prototype with no discernable end-user effect.
Firefox 完全対応 30IE 未対応 なしOpera 完全対応 22Safari 完全対応 8WebView Android 完全対応 ≤37Chrome Android 完全対応 35Firefox Android 完全対応 30Opera Android 完全対応 22Safari iOS 完全対応 8Samsung Internet Android ?

凡例

完全対応  
完全対応
未対応  
未対応
実装状況不明  
実装状況不明
実装ノートを参照してください。
実装ノートを参照してください。

isolation プロパティ

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
isolationChrome 完全対応 41Edge 未対応 なしFirefox 完全対応 36IE 未対応 なしOpera 完全対応 30Safari 完全対応 8WebView Android 完全対応 41Chrome Android 完全対応 41Firefox Android 完全対応 36Opera Android 完全対応 30Safari iOS 完全対応 8Samsung Internet Android 完全対応 4.0

凡例

完全対応  
完全対応
未対応  
未対応

mix-blend-mode プロパティ

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
mix-blend-modeChrome 完全対応 41Edge 未対応 なしFirefox 完全対応 32IE 未対応 なしOpera 完全対応 28Safari 完全対応 8WebView Android 完全対応 41Chrome Android 完全対応 41Firefox Android 完全対応 32Opera Android 完全対応 28Safari iOS 完全対応 8Samsung Internet Android 完全対応 4.0
On SVG elementsChrome 完全対応 41Edge 未対応 なしFirefox 完全対応 32IE 未対応 なしOpera 完全対応 28Safari 未対応 なしWebView Android 未対応 なしChrome Android 未対応 なしFirefox Android 完全対応 32Opera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android ?

凡例

完全対応  
完全対応
未対応  
未対応
実装状況不明  
実装状況不明
関連トピック