clipPath-html-06.xhtml (915B)
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" 7 xmlns:xlink="http://www.w3.org/1999/xlink"> 8 <head> 9 <style> 10 .unit { display:inline-block; width:100px; height:10px; } 11 </style> 12 </head> 13 <body style="margin:0"> 14 <span style="clip-path: url(#c1);"> 15 <span class="unit" style="background:lime;"></span> 16 <div style="height:200px; width:100px;"/> 17 <span class="unit" style="background:lime;"></span> 18 </span> 19 20 <svg:svg height="0" style="display: block"> 21 <!-- so that other documents can svg:use this one and force it to 22 load before onload --> 23 <svg:g id="empty" /> 24 <svg:clipPath id="c1" clipPathUnits="objectBoundingBox"> 25 <svg:rect x="0" y="0.5" width="0.5" height="0.5"/> 26 </svg:clipPath> 27 </svg:svg> 28 </body> 29 </html>