blend-difference-stacking.html (608B)
1 <!-- 2 Any copyright is dedicated to the Public Domain. 3 http://creativecommons.org/publicdomain/zero/1.0/ 4 --> 5 <html> 6 <style> 7 #b { 8 width: 200px; 9 height: 200px; 10 background-color: rgb(0,255,0); 11 } 12 #c { 13 z-index: 1; 14 position: absolute; 15 top:100px; 16 } 17 </style> 18 <div id="b"> 19 <svg width="100" height="100" viewBox="0 0 100 100" > 20 <rect style="fill:#00FF00;mix-blend-mode:difference;" width="100" height="100"/> 21 </svg> 22 <div id="c"> 23 <svg width="100" height="100" viewBox="0 0 100 100" > 24 <rect style="fill:#00FF00;mix-blend-mode:difference;" width="100" height="100"/> 25 </svg> 26 </div> 27 </div> 28 </html>