mask-html-zoomed-01.xhtml (859B)
1 <!-- 2 Any copyright is dedicated to the Public Domain. 3 http://creativecommons.org/publicdomain/zero/1.0/ 4 --> 5 <html xmlns="http://www.w3.org/1999/xhtml" 6 xmlns:svg="http://www.w3.org/2000/svg" reftest-zoom="2"> 7 <body style="margin:0"> 8 <div style="mask: url(#m1); width:250px; height:250px; background:lime;"></div> 9 <svg:svg height="0"> 10 <svg:mask id="m1" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox"> 11 <svg:linearGradient id="g" gradientUnits="objectBoundingBox" x2="0" y2="1"> 12 <svg:stop stop-color="white" offset="0"/> 13 <svg:stop stop-color="white" stop-opacity="0" offset="1"/> 14 </svg:linearGradient> 15 <svg:circle cx="0.25" cy="0.25" r="0.25" id="circle" fill="white"/> 16 <svg:rect x="0.5" y="0" width="0.5" height="1" fill="url(#g)"/> 17 </svg:mask> 18 </svg:svg> 19 </body> 20 </html>