mask-clip-2-ref.html (885B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS mask-clip reference</title> 6 <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com"> 7 <link rel="author" title="Mozilla" href="https://www.mozilla.org"> 8 <style type="text/css"> 9 svg { 10 position: absolute; 11 top: 10px; 12 border: 1px solid black; 13 } 14 </style> 15 </head> 16 <body> 17 <svg width="200" height="200" style="left: 10px;"> 18 <rect x="20" y="20" width="100" height="100" fill="blue"/> 19 </svg> 20 <svg width="200" height="200" style="left: 220px;"> 21 <rect x="50" y="50" width="50" height="50" fill="blue"/> 22 </svg> 23 <svg width="200" height="200" style="left: 10px; top: 220px;"> 24 <rect x="50" y="50" width="50" height="50" fill="green"/> 25 <rect x="60" y="60" width="40" height="40" fill="blue"/> 26 </svg> 27 </body> 28 </html>